打地鼠游戏

最新推荐文章于 2018-07-25 18:58:42 发布

xieqian0204

最新推荐文章于 2018-07-25 18:58:42 发布

阅读量336

点赞数

本文链接：https://blog.csdn.net/xieqian0204/article/details/78984130

版权

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
.hole{
width: 100px;
height: 100px;
float: left;
position: absolute;
/*background: aliceblue;*/
}
</style>
</head>
<body>
<div style="width: 800px;height: 480px; background: url(img/bg.jpg);margin: auto;">
<div class="hole" style="top: 7%;left: 30.5%;"></div>
<div class="hole" style="top: 7%;left: 46.5%;"></div>
<div class="hole" style="top: 7%;left: 62.3%;"></div>
<div class="hole" style="top: 24%;left: 30.5%;"></div>
<div class="hole" style="top: 24%;left: 46.5%;"></div>
<div class="hole" style="top: 24%;left: 62.3%;"></div>
<div class="hole" style="top: 260px;left: 30.5%;"></div>
<div class="hole" style="top: 260px;left: 46.5%;"></div>
<div class="hole" style="top: 260px;left: 62.3%;"></div>
</div>
<p id="score">分数:0</p>
<p id="lv">第1关</p>
<input type="button" id="btn" value="start" />
<input type="button" id="btn1" value="stop" />
<script type="text/javascript">
var time1,i=0;
var count=0;
var lv = 1;
var lvs =1500;
var holes =document.getElementsByClassName("hole");
var scoreShow = document.getElementById("score");
var olv = document.getElementById("lv");
var btn = document.getElementsByTagName("input");
btn[0].onclick = function(){
time1 = setInterval(function(){
if(i==10){
pass();
i=0;
}else{
createMouse();
}
},1800)
}
btn[1].οnclick=function(){
clearInterval(time1);
}
function createMouse(){
var newMouse = document.createElement("img");
num = Math.floor(Math.random()*8);
newMouse.className = "mouse";
newMouse.onclick = hit;
newMouse.src = "img/1.png";
holes[num].appendChild(newMouse);
setTimeout(function(){
holes[num].removeChild(holes[num].lastElementChild);
},lvs);
i++;
}
function hit(){
count+=100;
scoreShow.innerHTML = "分数"+count;
holes[num].removeChild(holes[num].lastElementChild);
var sucess = document.createElement("h2");
sucess.innerHTML = "+100";
holes[num].appendChild(sucess);
}
function pass(){
if(lvs<200){
alert("恭喜通关！");
}
if(count>=80*i){
alert("恭喜通过，进入下一关");
count=0;
lvs = lvs - (lv*150);
lv++;
olv.innerHTML = "第"+lv+"关";
scoreShow.innerHTML="分数："+count;
}
else{
alert("好可惜，再来一次吧");
count=0;
lv = 1;
lvs = 1500;
olv.innerHTML = "第一关";
scoreShow.innerHTML= "分数:"+count;
}
}
</script>
</body>
</html>

xieqian0204

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
打地鼠游戏

.hole{ width: 100px; height: 100px; float: left; position: absolute; /*background: aliceblue;*/ } 分数:0 第1关 var time1,
复制链接

扫一扫