js做的打气球打字游戏

来源:https://www.sucaihuo.com/js/2209.html 2017-06-20 22:31浏览(1171) 收藏

用h5和js写的打字游戏,无中生有,用定时器做的,可以改进
js做的打气球打字游戏
分类:游戏 > 益智 难易:初级
查看演示 下载资源 下载积分: 40 积分

<meta charset="utf-8"> <title></title> <style type="text/css"> *{margin: 0;padding: 0;} body{background: #434343;overflow: hidden;} .start{ position: fixed; width: 300px; height: 150px; background: #F5F5DC; color: black; top: 50%; left: 50%; text-align: center; line-height: 150px; border-radius: 10px; margin-top: -75px ; margin-left: -150px; font-size: 70px; } .score1{ position: fixed; width: 100px; height: 150px; background: #F5F5DC; color: black; top: 3%; left: 100%; text-align: center; border-radius: 10px; font-size: 34px; margin-left: -100px; } .score2,.score3{ width: 100px; height: 50px; font-size: 20px; text-align: center; line-height: 50px; border-radius: 5px; font-weight: bold; } .score2{ color: black; } .score3{ background: blue; cursor: pointer; margin-top: 5px; color: white; } .balloon{ position: absolute; left: 0; bottom: 0; width:50px; height: 50px; border-radius: 50px 50px 30px 50px; transform: rotate(45deg); background: #faf9f9; box-shadow:-8px -8px 80px -8px hotpink inset,-17px 11px 14px rgba(220,150,150,0.3); } .balloon:after{ content:'';/*伪元素的内容*/ position: absolute; display: block; bottom: -2px; right: -3px; height: 0px; width: 0px; border: 7px solid #dbbdbd; border-top-color: transparent;/*透明的*/ border-bottom-color: transparent; border-right-color: transparent; transform: rotate(225deg); border-radius: 10px; } .zimu{ top: 9px; left: 9px; position: absolute; width: 30px; height: 30px; line-height: 30px; text-align: center; font-size: 25px; transform: rotate(-45deg); } </style> <script type="text/javascript" src="打字游戏.js"></script> </head> <body> <div class="score1"> <h4>得分:</h4> <div class="score2" id="scorefensu">0</div> <div class="score3" onclick="chongzhi()">重新开始</div> </div> <div class="start" id="kaishi1" onclick="kaishi()">开始</div> </body>

标签: 气球打字
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2