在jQuery中更改图像的尺寸

3

这只是调整大小，但不能在不损失质量的情况下调整大小。

var max_size = 200; 

$("img").each(function(i) { 
    if ($(this).height() > $(this).width()) { 
    var h = max_size; 
    var w = Math.ceil($(this).width()/$(this).height() * max_size); 
    } 
    else { 
    var w = max_size; 
    var h = Math.ceil($(this).height()/$(this).width() * max_size); 
    } 

    $(this).css({ height: h, width: w }); 

});

更多的例子：

来源

2012-01-13 08:35:51

+0

感谢代码Sameera Thilakasiri。 – luckyluke 2012-01-16 03:35:04

+0

@luckyluke感谢您的赞赏，但如果您真的满意答案，您应该接受答案并进行投票，它也会给您带来声望。 – 2012-01-16 04:21:21

3

我不认为你可以，图像的质量是，图像的质量...增加尺寸就像放大该图像。

如果你问jQuery是否可以重新采样图像，简单的答案是否定的，并没有发送AJAX请求到一个服务器，可以在像PHP这样的脚本语言中进行重采样，你可以不幸的是保持它的质量。

我希望这有助于！ :)

来源

2012-01-13 08:33:13

+0

感谢克里斯Kempen的 – luckyluke 2012-01-16 03:31:28

0

你可以通过改变它们的宽度和高度属性来用jQuery来缩放图像。虽然图像质量不错，但我并没有真正了解图像质量受损的部分，就像您上传图像一样。

来源

2012-01-13 08:35:16 XepterX

+0

感谢XepterX。说到图像质量，我担心会避免像素化显示输出结果。 – luckyluke 2012-01-16 03:34:34

+0

你可以通过上传高分辨率图片然后使用css调整图片大小来避免这种情况。 – XepterX 2012-01-16 03:45:14

1

你不能没有正常光栅图像影响与客户方的JavaScript质量调整（BMP，JPG ，png等），因为图像的质量是有限的，有一种方法可以b e使用非常高质量的图像8000x8000，然后使用css将其缩小到所需的大小。

然后，您可以使用jQuery来调整它，你不会注意到质量下降，直到你开始了原始分辨率，在这种情况下是8000x8000

$("img").css("width","1024px"); 
$("img").css("height","768px");

有前往很多的问题用什么语言是

dynamically scale images in php jpg/png/gif
覆盖重采样服务器端
Resize an Image C#
Resize with minimal loss of quality

更新

你还没有说什么样的形象，你正在使用的格式，你可以考虑使用SVG和HTML5，那么你将能够调整到任何规模的客户都不会降低质量。

来源

2012-01-13 08:36:07 kamui

0

jQuery是不打算做图像优化。它没有图形基元。为什么你想在JavaScript中做到这一点？你没有服务器端语言？

无论如何，你应该看看在画布这样做。看看this SO post或this one

来源

2012-01-13 08:36:40 Grooveek

+0

感谢Grooveek – luckyluke 2012-01-16 03:36:43

0

的jQuery包含这样做没有直接的方法。您大概可以找到使用Flash或Applet的解决方案。

OR

你可以尝试绘制图像的画布，然后应用比例程序（双线性，双三次等）的像素在画布和渲染输出到其他画布。完成后，您可以从画布中获取图像数据，并通过AJAX将其发送回服务器进行保存。有关缩放算法的详细信息，请参阅：检查：http://en.wikipedia.org/wiki/Image_scaling）

来源

2012-01-13 08:39:07 techfoobar

+0

谢谢techfoobar。我会尝试 – luckyluke 2012-01-16 03:37:12

在jQuery中更改图像的尺寸

回答

相关问题