-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
76 lines (64 loc) · 2.15 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<html>
<head>
<meta charset="utf-8">
<title>MosquitoFight</title>
</head>
<style>
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="application/javascript">
</script>
<body>
<h1>MosquitoFight</h1>
<div id="info">
<span>Score : </span><span id="score-board">0</span>
<span> Time : </span><span id="counter"></span>
<span> Message : </span><span id="message"></span>
</div>
<script type="text/javascript">
var score = 0 ;
var countdown = 10;
var timer=setInterval(function () {
var gameOver = false;
if (document.getElementById('mosquito')=== null && gameOver!=true) {
var mosquito = document.createElement('img');
mosquito.src = './mosquito.png';
mosquito.style.position= 'absolute';
mosquito.style.width='130px';
mosquito.style.height='130px';
var x=Math.floor(Math.random() * window.innerWidth/2);
var y=Math.floor(Math.random() * window.innerHeight/2);
//console.log(x);
//console.log(y);
mosquito.style.left=x +'px';
mosquito.style.top=50+y + 'px';
mosquito.id='mosquito';
document.body.appendChild(mosquito);
}
document.getElementById('message').innerHTML='';
document.getElementById('counter').innerHTML=countdown-=1;
if (countdown<=0) {
gameOver=true;
clearInterval(timer);
//clearInterval(disappear);
document.getElementById('counter').innerHTML='0';
document.getElementById('message').innerHTML='時間結束';
}
},1000);
var disappear = setInterval(function() {
if (document.getElementById('mosquito') !== null) {
document.body.removeChild(document.getElementById('mosquito'));
}
},3000);
document.body.addEventListener('click',function(e) {
var scoreBoard=document.getElementById('score-board');
//console.log(e.target.parentNode);
//console.log(e.target);
//console.log(document.getElementById('mosquito'));
e.target.parentNode.removeChild(e.target);
score +=5;
scoreBoard.innerHTML=score;
document.getElementById('message').innerHTML='打中蚊子了';
});
</script>
</html>