使用jquery修剪图像

我正在寻找用户上传图像，然后将它裁剪成一定尺寸。我想要发生的事情本质上是一个div，它被设置为特定的裁剪尺寸以及该框内的图像。用户将能够滑动图像，并且该div中可见的任何东西都是该图像将被裁剪到的东西。使用jquery修剪图像

我遇到的所有jquery插件只是让用户围绕整个图像移动选择框，而不是将图像移动到选择框后面。这种事情是否存在，我只是错过了那个插件？

基本上它就像Facebook中的缩略图编辑器，您可以在缩略图大小的框中拖动图像。

2012-04-22 nbu

你并不真的需要一个插件。这可以通过设置背景位置值由香草jQuery和CSS来完成。

<div id="CroppedImageDiv"></div> 
<script type="text/javascript"> 
    function cropImage(imgUrl, cropWidth, cropHeight, cropStartX, cropStartY) { 
     var bgPos = cropStartX + "px " + cropStartY + "px"; 
     $('#CroppedImageDiv').width(cropWidth).height(cropheight).css('background-position', bgPos); 
     $('#CroppedImageDiv').css('background-url', imgUrl); 
    } 
</script>

来源

2012-04-22 02:45:54

这不会给我aroung拖动图像，虽然能力强，对不对？这只是为了确定最终的图像作物？对不起，我是一个JavaScript/jQuery初学者。 – nbu 2012-04-23 00:51:13

是的，这段代码只是在DIV中显示最终裁剪后的图像。对于实际的裁剪操作，您可以查看JCrop代码以获得灵感，但对于jQuery初学者来说，这可能具有挑战性...... – 2012-04-23 09:26:43