[浏览器事件]一串跟随鼠标运动的DIV
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <style> div{ width: 10px; height: 10px; background: red; position: absolute; } </style> </head> <body> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <script> var oDiv = document.getElementsByTagName("div"); var i = 0; var mouseTop = 0; var mouseLeft = 0; document.onmousemove = function (ev){ var oEvent = ev || event; for (i = oDiv.length-1; i > 0; i--) { oDiv[i].style.left = oDiv[i-1].style.left; oDiv[i].style.top = oDiv[i-1].style.top; } oDiv[0].style.left = oEvent.clientX+'px'; oDiv[0].style.top = oEvent.clientY+'px'; setTimeout(function (){ for (i = oDiv.length-1; i > 0; i--) { oDiv[i].style.left = oEvent.clientX+'px'; oDiv[i].style.top = oEvent.clientY+'px'; } }, 300); } </script> </body> </html>