变量num和timer代表什么呢
来源:2-3 存储实现打怪小案例
哈哈哈哈哈哈哈哈哦
2019-05-28 12:47:29
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin: 0; padding: 0;list-style: none; }
html,body{position: relative;height: 100%;}
.guai{
position:absolute;left: 50%;top: 50%;margin: -190px 0 0 -200px;
}
.line{
width: 400px; height: 20px;border: 4px solid black;position: absolute;left: 50%;top: 20px; margin: 0 0 0 -204px;
}
.xie{
height: 100% ;width: 400px ; background: red;transition: .3s;
}
</style>
</head>
<body>
<div class="line">
<div class="xie"></div>
</div>
<img src="1.jpg" alt="" class="guai">
<script>
var num = 0, timer = null;
onclick= function(){
clearInterval(timer);
setInterval(function(){
num++;
if(num == 10){
clearInterval(timer);
num = 0;
document.body.style.left = 0;
document.body.style.top =0;
return;
}
document.body.style.left = Math.random() * -20 + 10 +'px';
document.body.style.top = Math.random() * -20 + 10 +'px';
},30)
}
</script>
</body>
</html>
1回答
同学你好,1、 num表示次数,用来控制震动效果的完成时间
每执行一次定时器,body的left和top都会设置一个随机的值。通过执行num加一,判断num等于10的时候修改body的left和top值为0。将num重置为0, 并清除定时器。实现一个震动的效果
2、timer表示页面中定时器的个数
如果帮助到了你, 欢迎采纳!
祝学习愉快~~~
相似问题