Skip to content
Permalink
Branch: master
Find file Copy path
Find file Copy path
Fetching contributors…
Cannot retrieve contributors at this time
46 lines (45 sloc) 983 Bytes
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>1 定时器注意的问题</title>
<style type="text/css">
#box{width: 100px; height: 100px; border-radius: 50%; background-color: pink; position: absolute;}
#line{ width: 100%; height: 1px; background-color: #000; position: absolute; top:200px; }
</style>
</head>
<body>
<button onclick="start()">开始</button>
<button onclick="stop()">停止</button>
<div id="box" style="top:50px; left:0;"></div>
<div id="line"></div>
<script>
// 找对象
var box = document.getElementById('box');
var timer;
function start()
{
var speed = 0;
if (!timer){
timer = setInterval(function(){
speed += 5;
var tmp = parseInt(box.style.top) + speed;
if(tmp >= 100) {
speed = -speed;
tmp = 100;
}
box.style.top = tmp + 'px';
console.log(box.style.top);
console.log(timer);
},100);
}
}
function stop()
{
clearInterval(timer);
timer = undefined;
console.log(timer);
}
</script>
</body>
</html>
You can’t perform that action at this time.