<html>
<head>
<title> 增加div块</title>
</head>
<script>
function chardiv(){
var time;
this.creater=function(){
var a=document.createElement("mydiv"); //创建新的div块
a.style.top=Math.random()*200;
a.style.left=Math.random()*200;
a.style.position="absolute";
a.style.width=35; //新div块的宽度
a.style.height=35; //新div块的高度
a.innerHTML="A";
a.style.background="yellow"; //新div块的背景颜色
mydiv.appendChild(a);
this.move=function(){
a.style.top=parseInt(a.style.top)+20; //div块移动
if(parseInt(a.style.top)>370){ //如果移动到大于370px
a.style.top=0; //返回离top=0px
}
}
}
}
function stop(){
clearInterval(time); //清除定时器
}
function gamestart(){
var charA=new chardiv(); //new 一个实例charA
charA.creater();
charA.move();
time=setInterval(function(){
charA.move();
},500);
}
</script>
</head>
<body>
<button οnclick="gamestart()">start</button>
<button οnclick="stop()">stop</button>
<div id="mydiv" style="position:absolute;width:500;height:400;background:green;top:50"></div>
</body>
<head>
<title> 增加div块</title>
</head>
<script>
function chardiv(){
var time;
this.creater=function(){
var a=document.createElement("mydiv"); //创建新的div块
a.style.top=Math.random()*200;
a.style.left=Math.random()*200;
a.style.position="absolute";
a.style.width=35; //新div块的宽度
a.style.height=35; //新div块的高度
a.innerHTML="A";
a.style.background="yellow"; //新div块的背景颜色
mydiv.appendChild(a);
this.move=function(){
a.style.top=parseInt(a.style.top)+20; //div块移动
if(parseInt(a.style.top)>370){ //如果移动到大于370px
a.style.top=0; //返回离top=0px
}
}
}
}
function stop(){
clearInterval(time); //清除定时器
}
function gamestart(){
var charA=new chardiv(); //new 一个实例charA
charA.creater();
charA.move();
time=setInterval(function(){
charA.move();
},500);
}
</script>
</head>
<body>
<button οnclick="gamestart()">start</button>
<button οnclick="stop()">stop</button>
<div id="mydiv" style="position:absolute;width:500;height:400;background:green;top:50"></div>
</body>
</html>
效果示意图：
835
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
