我们可以使用jquery调整图像大小吗？

是否有可能从url下载图片并使用jquery实际调整图片大小而不使用任何服务器端脚本？我已经做了很多搜索，但没有找到任何解决方案。我们可以使用jquery调整图像大小吗？

2016-07-22 Vipin Singh

“物理”调整图像大小意味着什么？你期望这样一个过程的输出到屏幕，到本地文件，还是回到服务器？ – nnnnnn

[jquery resizing image]可能的重复（http://stackoverflow.com/questions/1143517/jquery-resizing-image） – abhishek

“物理”调整大小意味着我想在本地下载图像，并希望创建新的图像与较小的尺寸。例如，如果我已经下载大小为1 MB的图像，那么我想将其大小减小到200kb。 –

如果您需要下载，你可以使用画布这样

HTML

<canvas id="c" width="200" height="150"></canvas> 
<a id="download">Download as image</a>

的JavaScript

// Grab the Canvas and Drawing Context 
var canvas = document.getElementById('c'); 
var ctx = canvas.getContext('2d'); 
// Create an image element 
var img = document.createElement('IMG'); 
// Specify the src to load the image 
img.setAttribute('crossOrigin', 'anonymous'); 
img.src = "http://i.imgur.com/adB2oag.png"; 
// When the image is loaded, draw it 
img.onload = function() { 
    ctx.drawImage(img, 0, 0, img.width, img.height, 0, 0, canvas.width, canvas.height); 
} 

function downloadCanvas(link, canvasId, filename) { 
    link.href = document.getElementById(canvasId).toDataURL(); 
    link.download = filename; 
} 

document.getElementById('download').addEventListener('click', function() { 
    downloadCanvas(this, 'c', 'test.png'); 
}, false);

放图像画布，只要你喜欢大小的图片，并下载画布图片

你可以试试这个jsFiddle

来源

2016-07-22 06:43:32

我们可以使用jquery调整图像大小吗？

回答

相关问题