js 图片放大效果 修正版

　　<div style="border:1px solid #CCC;position:absolute; width:200px; height:100px; cursor:move;" id="jelle_test_divquot;>

　　这个DIV 可以移动，你可以测试下。

　　</div>

　　<script type="text/javascript">

　　var getMouseP=function (e){//获取鼠标坐标 请传递evnet参数

　　e = e || window.event;

　　var m=(e.pageX || e.pageY)?{ x:e.pageX, y:e.pageY } : { x:e.clientX + document.body.scrollLeft - document.body.clientLeft, y:e.clientY + document.body.scrollTop - document.body.clientTop };

　　return m;

　　};

　　move=function(o,t){

　　o=$j(o);

　　t=$j(t);

　　o.onmousedown=function(ev){

　　var mxy=getMouseP(ev);//获取当前鼠标坐标

　　var by={x:mxy.x-(t.offsetLeft),y:mxy.y-(t.offsetTop)};

　　o.style.cursor="move";

　　document.onmousemove=function(ev){

　　var mxy=getMouseP(ev);

　　t.style.left=mxy.x-by.x+"px";

　　t.style.top=mxy.y-by.y+"px";

　　};

　　document.onmouseup=function(){

　　window.getSelection ? window.getSelection().removeAllRanges() : document.selection.empty();

　　this.onmousemove=null;

　　}

　　}

　　}

　　move("jelle_test_div","jelle_test_div");

　　</script>

　　<div style="border:1px solid #CCC; width:500px; height:415px; background:url(xxx/c.jpg);" id="jelle_warpper">

　　<div style="width:100px; height:50px; border:1px solid #CCC;" id="jelle_move"></div>

　　</div>

　　<script type="text/javascript">

　　var mp=function (e){//获取鼠标坐标 请传递evnet参数

　　e = e || window.event;

　　var m=(e.pageX || e.pageY)?{ x:e.pageX, y:e.pageY } : { x:e.clientX + document.body.scrollLeft - document.body.clientLeft, y:e.clientY + document.body.scrollTop - document.body.clientTop };

　　return m;

　　}

　　var move2=function(o,t){//请提前设置CSS position:absolute;并激活filter:alpha(opacity=100);

　　//o相应鼠标拖动的区域ID T被移动对象的ID

　　o=$j(o);

　　t=$j(t);

　　by_o={x:o.offsetLeft,y:o.offsetTop};

　　o.onmousemove=function(ev){

　　//var mxy=Jelle.getMouseP(ev);//获取当前鼠标坐标

　　var by={x:t.offsetLeft,y:t.offsetTop};

　　var ms=mp(ev);

　　t.innerHTML=(by_o.x-by.x)+"---"+(by_o.x-by.y);

　　jy=ms.y-by_o.y-25;

　　jx=ms.x-by_o.x-50;

　　maxy=415-50;//减去移动框的高度

　　maxx=500-100;//减去移动框的宽度

　　var y=jy>=maxy?maxy:jy<=0?0:jy;

　　var x=jx>=maxx?maxx:jx<=0?0:jx;

　　t.style.marginTop=y+"px";

　　t.style.marginLeft=x+"px";

　　}

　　}

　　move2("jelle_warpper","jelle_move")

　　</script>