onmouseover事件
根据教学视频写了个onmouseover事件:
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <title>20170414-Event-2</title> 6 <script src="20170414-Event-2.js" type="text/javascript" charset="utf-8"></script> 7 </head> 8 <body> 9 </body> 10 </html>
1 function create(mouse){ 2 var num=44; 3 var bgcolor='#'; 4 var body=document.getElementsByTagName('body')[0]; 5 var div=document.getElementsByTagName('div'); 6 // var scr_x=document.documentElement.scrollLeft; 7 // var scr_y=document.documentElement.scrollTop; 8 var arr=new Array('0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'); 9 for (var i=0;i<6;i++) { 10 var index=Math.floor(Math.random()*arr.length); 11 bgcolor+=arr[index]; 12 } 13 for (var j=0;j<num;j++) { 14 var rand=Math.random()*40; 15 div[j]=document.createElement('div'); 16 body.appendChild(div[j]); 17 div[j].style.position='absolute';//必不可少,否则不随鼠标移动 18 div[j].style.width=div[j].style.height=rand+'px'; 19 div[j].style.borderRadius='50%'; 20 div[j].style.backgroundColor=bgcolor; 21 div[j].style.opacity=Math.random();24 div[j].style.left=mouse.clientX+rand*i+'px'; 25 div[j].style.top=mouse.clientY+Math.random()*40*i+'px'; 26 } 27 } 28 document.onmousemove=create;