js实现打气球小游戏

SKY丶NL

已于 2022-05-18 16:19:37 修改

阅读量493

点赞数

文章标签： javascript 游戏 html

于 2022-05-18 16:17:52 首次发布

本文链接：https://blog.csdn.net/SKY_NL/article/details/124844822

版权

本文介绍了如何利用JavaScript编程实现一款简单的打气球小游戏。通过结合HTML和JavaScript，创建游戏界面和交互逻辑，让读者了解动态网页应用的开发过程。

摘要由CSDN通过智能技术生成

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			*{margin:0px;padding:0px;}
			body,html{
				height:100%;
				width:100%;
				overflow:hidden;
				background:url(imgs/bg.jpg);
				background-size:cover;
			}
			.balloon{
				
				width:96px;
				height:123px;
				position:absolute;
				left:0px;
				top:0px;
				background:url(imgs/balloon.png) no-repeat 0px 0px;
				/* border:1px solid red; */
			}
			.scoreDom{
				position:absolute;
				top:0px;left:0px;
				width:210px;
				height:45px;
				font-size:20px;
				color:white;
				background:red;
				border-radius:8px;
				z-index:1;
				text-align:center;
				line-height:45px;
			}
			.centerDom{
				position:absolute;
				top:50%;left:50%;
				margin-left:-200px;
				margin-top:-100px;
				width:400px;
				height:200px;
				font-size:20px;
				color:red;
				background:white;
				text-align:center;
				line-height:100px;
				border-radius:8px;
			}
			.endDom{
				position:absolute;
				top:50%;left:50%;
				margin-left:-200px;
				margin-top:-100px;
				width:400px;
				height:200px;
				font-size:20px;
				color:red;
				background:white;
				text-align:center;
				line-height:100px;
				border-radius:8px;
			}
			.Dtime{
				position:absolute;
				top:0px;right:0px;
				width:210px;
				height:45px;
				font-size:20px;
				color:white;
				background:red;
				border-radius:8px;