Jquery,调整图像数据的大小

时间:2014-01-30 14:00:44

标签: javascript jquery image

我有一个用于调整图像大小的脚本。

因此,首先,我的图片包含:height=600pxwidth=500px

我使用我的脚本后,将此图片的大小调整为,例如:height=300pxwidth=250px

我用:

$('#image').css("width", varvar);
$('#image').css("height", varvarvar);

但是,如果我用firebug查看我的图像,数据总是以原始大小(600和500),我如何用jquery调整数据(src)的图像?

2 个答案:

答案 0 :(得分:0)

正如评论中详细提到的那样,无法使用客户端脚本更改图像的原始大小(如数据量)。问题是图像托管在服务器端,任何javascript操作仍然严格在客户端。如果你想提交某种类型的数据更改,那就需要服务器端脚本,比如PHP(虽然还有很多其他选择......)

基本上,我们的想法是客户端向服务器发送图像处理请求,然后服务器运行某种脚本来更改原始图像数据并替换服务器上的原始文件。在页面刷新时,图像会发生变化。

答案 1 :(得分:0)

使用.css时,您正在更改图像的样式属性。如果你想改变它的宽度和高度属性,你必须这样做:

var img = document.getElementById('image'), height = 25, width = 50;
    img.width = width;
    img.height = height;

然后,当您检查元素时,您将看到其宽度和高度属性已更改。 但这只是在浏览器上。它不会永久改变其宽度和高度。但是,您可以将其转换为Base64并将其发送到您的服务器。但是你必须使用HTML5画布。如果需要,我可以告诉你如何做到这一点。