js实现拖动,刚学js时写的
太简单了,功能也就不完善。拖动的时候,如果鼠标移动的太快,就乱了。
/htdocs/html/dd.html
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>js拖动</title> <style type="text/css"> #test { width: 200px; height: 150px; border: 1px solid #ccc; position: absolute; top: 100px; left: 100px; } #test h5 { width: 200px; height: 20px; margin: 0; padding: 0; background: #666; color: #fff; cursor: move; } </style> <script type="text/javascript"> var draging = false; function setPos(a, b){ if(draging){ document.getElementById('test').style.left = a+'px'; document.getElementById('test').style.top = b+'px'; } } </script> </head> <body> <div id="test"> <h5 onmousemove="setPos(event.clientX-100, event.clientY-10);" onmousedown="draging = true;" onmouseup="draging = false;">title</h5> content </div> </body> </html>