<!DOCTYPE html><html><head><meta charset="UTF-8"><meta name="description" content=""><meta name="keywords" content=""><title>Examples</title><style type="text/css">??? *{margin: 0;padding: 0;}??? a{text-decoration: none;color: #333;}??? ul,li{list-style: none;}??? body{font-size: 14px;font-family: "微軟雅黑";}??? .box{width:100px;height:100px;background:red;border-radius: 50%;position:absolute;left:0px;top:0px;}</style></head><body>??? <script type="text/javascript">??? for(var i=0;i<=10;i++){??????? var div=document.createElement("div");??????? document.body.appendChild(div);??????? div.className="box";??????? div.x=0;//開始值??????? div.y=0;??????? div.xspeed=i+2;//速度??????? div.yspeed=i+2;??????? div.onclick=function(){??????????? var dom=arr.splice(arr.indexOf(this),1);//找到每一個??????????? this.parentNode.removeChild(dom[0]);??????? }??????? var divClass=document.getElementsByClassName("box");??????????? var arr=[].slice.call(divClass);//轉換成數(shù)組??? }??? function play(){??????? for(var j=0;j<arr.length;j++){??????????? var boxDome=arr[j];??????????? var maxW=document.innerWidth-boxDome.offsetWidth;??????????? var maxH=document.innerHeight-boxDome.offsetHeight;??????????? boxDome.x+=div.xspeed;??????????? boxDome.y+=div.yspeed;??????????? if(boxDome.x<0){??????????????? boxDome.x=0;??????????????? boxDome.xspeed=-div.xspeed;??????????? }??????????? if(boxDome.x>maxW){??????????????? boxDome.x=maxW;??????????????? boxDome.xspeed=-div.xspeed;??????????? }??????????? if(boxDome.y<0){??????????????? boxDome.y=0;??????????????? boxDome.yspeed=-div.yspeed;??????????? }??????????? if(boxDome.y>maxH){??????????????? boxDome.y=maxH;??????????????? boxDome.yspeed=-div.yspeed;??????????? }??????????? boxDome.style.left=boxDome.x+'px';??????????? boxDome.style.top=boxDome.y+'px';??????? }??? }??? play();??? setInterval(play,1000/30);??? </script></body></html>小球控制不了,應該是10個怎么看到1個?兩個問題
js實現(xiàn)小球運動的問題
慕先生4463397
2017-05-08 20:51:38