点击后不动，没看出问题
来源：2-3 存储实现打怪小案例
崔浩晟
2020-03-03 14:27:29
<!DOCTYPE html>
<html>
<head>
<title>打boss</title>
</head>
<body>
<div class="line">
<div class="blood"></div>
</div>
<img class="master" src="../images/boss.jpeg">
</body>
<script>
var num = 0;timer = null;
var master = document.querySelector(".master")
onclick = function(){
clearInterval(timer)
timer = setInterval(function(){
num++
if(num == 5){
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>
<style>
*{margin: 0;padding: 0;list-style: none;}
.master{
position: absolute;
left: 50%;
top: 50%;
margin-left: -100px;
margin-top: -75.5px;
}
.line{
width: 400px;
height: 15px;
margin: 20px 0 0 0;
border: 2px solid black;
position: absolute;
left: 50%;
margin-left: -200px;
}
.blood{
background-color: red;
width: 100%;
height: 100%;
transition: .3s;
}
body{
position: relative;
height: 100%;
}
html{height: 100%;}
</style>
</html>
1回答
-
同学你好，如下，Math.random()的使用缺少括号，添加上即可。
另，建议：将style标签存放到head中，然后书写css样式。
如果我的回答帮助了你，欢迎采纳，祝学习愉快~
0
相似问题