(047)javascript_event_mouseevent2 

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 <html xmlns="http://www.w3.org/1999/xhtml">
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <title>EVENT</title>
 6     <style type="text/css">
 7         div {
 8             width: 15px;
 9             height: 15px;
10             background: blue;
11             position: absolute;
12         }
13     </style>
14     <script type="text/javascript">
15 
16         window.onload = function() {
17 
18             var divArr = document.getElementsByTagName("div");
19             var i;
20 
21             document.onmousemove = function(ev) {
22 
23                 var oEvent = ev || event;
24 
25                 for(i = divArr.length - 1; i > 0; i--) {
26                     divArr[i].style.left = divArr[i-1].style.left;
27                     divArr[i].style.top = divArr[i-1].style.top;
28                 }
29 
30                 divArr[0].style.left = oEvent.clientX + "px";
31                 divArr[0].style.top = oEvent.clientY + "px";
32 
33             };
34         }
35 
36     </script>
37 </head>
38 
39 <body>
40 
41     <div></div>
42     <div></div>
43     <div></div>
44     <div></div>
45     <div></div>
46     <div></div>
47     <div></div>
48     <div></div>
49     <div></div>
50     <div></div>
51     <div></div>
52     <div></div>
53     <div></div>
54 
55 </body>
56 </html>

 

posted @ 2014-03-23 11:10  雪中飞雁  阅读(66)  评论(0)    收藏  举报