67 lines
2.4 KiB
HTML
67 lines
2.4 KiB
HTML
|
|
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Document</title>
|
|
<link rel="stylesheet" href="./css/index.css">
|
|
</head>
|
|
|
|
<body>
|
|
<!-- 声音! -->
|
|
<!-- 在js上可以用$('').play播放 -->
|
|
<audio class="hit" src="./music/sfx_hit.ogg"></audio>
|
|
<audio class="point" src="./music/sfx_point.ogg"></audio>
|
|
<audio class="backgroundmusic" src="./music/7868.mp3" loop></audio>
|
|
<!-- <audio autoplay loop preload="auto">
|
|
<source src="./music/7868.mp3" type="audio/mp3">
|
|
</audio> -->
|
|
|
|
|
|
|
|
<!-- 暂停 -->
|
|
<img class="pause hidden" src="./img/pause.png" alt="">
|
|
<!-- 开始 -->
|
|
<div class="start">
|
|
<img class="logo" src="./img/title.png" alt="">
|
|
<img class="play" src="./img/start.png" alt="">
|
|
</div>
|
|
<!-- 准备 -->
|
|
<div class="ready hidden">
|
|
<img src="./img/ready.png" alt="">
|
|
<img src="./img/示意图.png" alt="">
|
|
</div>
|
|
<!-- 选择主题色以后的小鸟 -->
|
|
<div class="startBird hidden"
|
|
style="animation: yellowMotion 0.4s linear infinite,birdShake 0.4s linear infinite;"></div>
|
|
<!-- 难度选择 -->
|
|
<div class="choice">
|
|
<select class="speed" name="" id="">
|
|
<option value="1">easy</option>
|
|
<option value="2">difficult</option>
|
|
</select>
|
|
</div>
|
|
<!-- 鸟的主题色 -->
|
|
<div class="birdTheme">
|
|
<div class="bird yellow show" style="top: 0px;animation: yellowMotion 0.4s linear infinite;"></div>
|
|
<div class="bird red" style="top: 0px;animation: redMotion 0.4s linear infinite;"></div>
|
|
<div class="bird blue" style="top: 0px;animation: blueMotion 0.4s linear infinite;"></div>
|
|
</div>
|
|
<!-- 地板 -->
|
|
<div class="ground">
|
|
<img class="groundOne" src="./img/diban.png" alt="">
|
|
<img class="groundTwo" src="./img/diban.png" alt="">
|
|
</div>
|
|
<!-- 倒计时的的数字 -->
|
|
<span class="readynum"></span>
|
|
<!-- 分数 -->
|
|
<div class="result hidden"></div>
|
|
</body>
|
|
<script src="./js/util.js"></script>
|
|
<script src="./js/index.js"></script>
|
|
|
|
</html>
|