jquery 图片裁切预览,容易拖动

jquery 图片裁切预览,简单拖动

看到网上的图片裁切，很是有感觉，我自己基于jquery-ui，然后根据大家普遍接受的clip原理，实现的简单的预览

想整张图片，不知道怎么整上。

?

?

// JavaScript Documentvar layerx;var layery;var i=0;$(document).ready(function(){  $("#demo")[0].onmousedown=drag;//准备拖动  $("#demo")[0].onmousemove=dmove;//开始拖动  document.onmouseup=delmouse;//停止移动   });function drag(event){event=event||window.event;stopBubble(event);stopdefault(event);i=1;layerx=event.offsetX||event.layerX;layery=event.offsetY||event.layerY;}function dmove(event){event=event||window.event;stopBubble(event);stopdefault(event);if(i==1){$("#demo")[0].style.left=event.clientX-layerx+"px";$("#demo")[0].style.top=event.clientY-layery+"px";}}function delmouse(){i=0;}//防止冒泡事件function stopBubble(e){if(e&&e.stopPropagation){e.stopPropagation();}else{window.event.cancelBubble=true;}}//阻止浏览器默认行为function stopdefault(e){if(e&&e.preventDefault){e.preventDefault();}else{window.event.returnValue=false;//取消默认事件}}

?缩放的原理也不难，在这就不发了。

?