JS高级-分享一个别踩白块的小游戏（源码）

最新推荐文章于 2024-05-13 19:25:21 发布

清风丶Spirit_Breeze

最新推荐文章于 2024-05-13 19:25:21 发布

阅读量4.5k

点赞数 6

分类专栏：前端JS

本文链接：https://blog.csdn.net/Spirit_Breeze/article/details/80977916

版权

"我是Spirit_Breeze,中文<晟世清风>,在这纷纷乱世之中,祈望能有一股清流之风." 本人从事销售,不甘心于口舌之利,突然对代码和框架充满兴趣,遂之研究研究,欢迎研究讨论,转载请备注地址和作者,谢谢。

第7章综合案例（别踩白块JS）

整体思路：

1：创建基本的静态页面；

2：让div动起来

3：动态创建Div

4：动起来后，填补缺失的div

5：随机创建黑块

6：绑定点击事件

7：点击判断输赢

8：游戏结束后的限制处理

9：黑块触底的处理

10：加分

11：加速

注意变量作用域和this指向的问题

insertBefore、firstChild、getComputedStyle、appendChild、createElement、Math.random、Math.floor

<!DOCTYPEhtml>
<htmllang="en">
<head>
   <metacharset="UTF-8">
   <title>Document</title>
   <style>
   #cont {
     margin-top:100px;
     width: 400px;
     height: 400px;
     border-top:1pxsolidblue;
     position: relative;
     /*隐藏顶部*/
     overflow: hidden;
      }
   #main {
     width: 400px;
     height: 400px;
     /*去掉红框*/
     /* border:1px solidred; */
     position: relative;
     top:-100px;
      }
   .row {
     height: 100px;
      }
   .rowdiv {
     width: 98px;
     height: 98px;
     border:1pxsolidgray;
     float:

最低0.47元/天解锁文章

清风丶Spirit_Breeze

关注

6
点赞
踩
22

收藏

觉得还不错? 一键收藏
0
评论
JS高级-分享一个别踩白块的小游戏（源码）

"我是Spirit_Breeze,中文&amp;lt;晟世清风&gt;,在这纷纷乱世之中,祈望能有一股清流之风." 本人从事销售,不甘心于口舌之利,突然对代码和框架充满兴趣,遂之研究研究,欢迎研究讨论,转载请备注地址和作者,谢谢。第7章综合案例（别踩白块JS）整体思路：1：创建基本的静态页面；2：让div动起来3：动态创建Div4：动起来后，填补缺失的div 5：随机创建黑块6：绑定点击事件7：点...
复制链接

扫一扫