1 <!doctype html> 2 <html> 3 <head> 4 <meta http-equiv="content-type" content="text/html;charset=utf-8"/> 5 <title>拖拽</title> 6 <style> 7 #drag{ 8 position:absolute; 9 width:200px; 10 height:100px; 11 background-color:red; 12 } 13 </style> 14 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script> 15 <script type="text/javascript"> 16 $(function(){ 17 18 var is_drag=false; 19 var x=0; 20 var y=0; 21 22 $("#drag").mouseover(function(){$(this).css("cursor","move");}); 23 24 $("#drag").mousedown(function(){ 25 is_drag=true; 26 x=event.offsetX; 27 y=event.offsetY; 28 $(this).css("cursor","move"); 29 }); 30 31 $("#drag").mouseup(function(){is_drag=false;}); 32 33 $(document).mousemove(function(){ 34 if(!is_drag){return;} 35 $("#drag").css({"left":event.clientX-x,"top":event.clientY-y,"cursor":"move"}); 36 }); 37 38 }); 39 </script> 40 </head> 41 <body> 42 <div id="drag"></div> 43 </body> 44 </html>
623
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
