<title>无标题文档</title> <style> #div1{ width:200px; height:200px; position:absolute; background:red;} </style> </head> <script> window.onload=function(){ var oDiv=document.getElementById(‘div1‘); var disX=0; var disY=0; oDiv.onmousedown=function(ev){ var oEvent=ev || event; disX=oEvent.clientX-oDiv.offsetLeft; disY=oEvent.clientY-oDiv.offsetTop; document.onmousemove=function(ev){ var oEvent=ev || event; var l=oEvent.clientX-disX; var t=oEvent.clientY-disY; if(l<0){ l=0; } else if(l>document.documentElement.clientWidth-oDiv.offsetWidth) { l=document.documentElement.clientWidth-oDiv.offsetWidth; } if(t<0){ t=0; }else if(t>document.documentElement.clientHeight-oDiv.offsetHeight) { t=document.documentElement.clientHeight-oDiv.offsetHeight; } oDiv.style.left=l+‘px‘; oDiv.style.top=t+‘px‘; } document.onmouseup=function(){ document.onmousemove=null; document.onmouseup=null; } } } </script> <body> <div id="div1"></div> </body> </html>
原文：http://www.cnblogs.com/zxl89/p/6412797.html