1，实现效果：点击Div块并拖动鼠标，移动Div的位置。
2，实现代码：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>移动div</title> </head> <body> <div id="divSlider" style="width: 100px;height: 100px;background-color: deepskyblue; position: absolute;top: 10px;left: 10px;"> </div> <script> var divSlider = document.getElementById("divSlider"); divSlider.addEventListener('mousedown', mouseDown, false); document.addEventListener('mouseup', mouseUp, false); function mouseDown() { document.addEventListener('mousemove', sliderMove, false); } function mouseUp() { document.removeEventListener('mousemove', sliderMove, false); } function sliderMove(e) { // 解决拖拽鼠标粘滞的问题 // if (e.preventDefault) { // e.preventDefault(); // } else { // e.returnValue = false; // } divSlider.style.left = e.clientX + 'px'; divSlider.style.top = e.clientY + 'px'; } </script> </body> </html>
