相思湖学院 15级JS课程
2017-11-22 18:20
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
<html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> * { padding: 0; margin: 0; } body { width: 100%; height: 600px; background: url(images/bg.jpg) top left no-repeat; background-size: cover; position: relative; cursor: pointer; } img { position: absolute; } </style> </head> <body> <script> function Star(src,x,y,width){ this.src = src; this.x = x; this.y = y; this.width = width; this.image = function(){ var img = new Image(); img.src = this.src; img.style.width = this.width+"px"; img.style.height = this.width+"px" ; img.style.left = this.x+"px" ; img.style.top = this.y+"px" ; img.style.opacity = 1; document.body.appendChild(img); var num = 0; var flag1 = (Math.random()<0.3)?-1:1; var flag2 = (Math.random()<0.3)?-1:1; var pathX = flag1 *Math.random()*3; var pathY = flag2 *Math.random()*3; var time =setInterval(function (){ img.style.left = img.offsetLeft+pathX+"px"; img.style.top=img.offsetTop+pathY+"px"; num++; if(num>10){ clearInterval(time); } },50); } } var arr=[ "images/subball1.png", "images/subball2.png", "images/subball3.png", "images/subball4.png", "images/subball5.png", "images/subball6.png", "images/subball7.png", "images/subball8.png" ]; document.body.onclick = function(event){ var src = arr[Math.floor(Math.random()*arr.length)]; var x =event.clientX - 5; var y=event.clientY+5; var sign = (Math.random()<0.5)?0:1; var width = 20+sign* 10; var image=new Star(src,x,y,width); image.image(); }; document.body.onclick = function(event){ for(var i=0;i<3;i++){ var src = arr[Math.floor(Math.random()*arr.length)]; var x =event.clientX -5; var y =event.clientY +5; var sign=(Math.random()<0.5)?0:1; var width=20+sign*10; var Image=new Star(src,x,y,width); Image.image(); } }; </script> </body> <cml>
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。
提交了 相思湖学院 15级JS课程 任务 事件对象event属性的应用——随机星星效果 的任务作业。