在这里谢谢Jquery开发者得八辈儿祖宗啊。。是他让编写JS如此之简单，不废话了。写代码，走着。
兄弟记住要引用jquery。。。。
下面是实现拖动的核心代码，想用copy到你那里，你懂得。
(function($){ $.fn.jqDrag=function(h){return i(this,h,'d');}; $.fn.jqResize=function(h){return i(this,h,'r');}; $.jqDnR={dnr:{},e:0, drag:function(v){ if (M.k == 'd') { E.css({left:M.X+v.pageX-M.pX,top:M.Y+v.pageY-M.pY}); } else { E.css({width:Math.max(v.pageX-M.pX+M.W,0),height:Math.max(v.pageY-M.pY+M.H,0)}); E.find("img").each(function(){ $(this).css("width", E.width() - 1); // 设定实际显示宽度 $(this).css("height", E.height() - 1); // 设定实际显示宽度 }); } return false; }, stop:function(){ E.css('opacity',M.o);$().unbind('mousemove',J.drag).unbind('mouseup',J.stop); }};var J=$.jqDnR,M=J.dnr,E=J.e,i=function(e,h,k){ return e.each(function(){ h=(h)?$(h,e):e; //alert(h.css("width")); h.bind('mousedown',{e:e,k:k},function(v){var d=v.data,p={};E=d.e; // attempt utilization of dimensions plugin to fix IE issues if(E.css('position') != 'relative'){ try{E.position(p);}catch(e){} } M={ X:p.left||f('left')||0, Y:p.top||f('top')||0, W:f('width')||E[0].scrollWidth||0, H:f('height')||E[0].scrollHeight||0, pX:v.pageX, pY:v.pageY, k:d.k, o:E.css('opacity') }; E.css({opacity:0.8});$().mousemove($.jqDnR.drag).mouseup($.jqDnR.stop); return false; }); });},f=function(k){return parseInt(E.css(k))||false;};})(jQuery);
我地个去了，没写几篇blog不知道怎么插入代码，崩溃。。。。。。
HTML代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=GBK" /><script type="text/javascript" src="jquery-1.3.2.js"></script><script type="text/javascript" src="jqs.js"></script><style>.drag{position:absolute;border:1px solid #ddd;text-align:center;padding:5px;top:100px;left:20px;cursor:move;} .jqHandle { background-color:#FFF; height:15px; z-index: 100;} .jqDrag { width: 100%; cursor: move;} .jqResize { width: 15px; position: absolute; bottom: 0; right: 0; cursor: se-resize;}.jqDnR { z-index: 3; position: relative; width: 150px; height:150px; font-size: 0.77em; color: #618d5e; margin: 5px 10px 10px 10px; padding: 1px; background-color: #EEE; border: 1px solid #CCC;}</style><title>Insert title here</title><script>
$(function() { $('#ex1').jqDrag();
});</script></head><body>
<div id="ex1" class="jqDnR"> sdfdsf</div></body></html>
欢迎拍我。。。。。
