HTML5 + JS实现俄罗斯方块原理及具体步骤

1、html5 + js实现俄罗斯方块原理及具体步骤看法：俄罗斯方块有7个零件，每个零件所占的矩形的个数和位置不同，所以建立零件类，然后建立积累存储7个零件，每个零件包容存储该零件所占的矩形的个数和位置，下面为大家具体介绍下本嬉戏实现的基本原理： 嬉戏区域是限定大小的区域，本嬉戏的嬉戏区域有21×25个矩形，每个矩形宽度为10个单位，heght为6个个（canvas的肯定单位是固定的，非rusblock 类包含相应的数据和行为，创建二维数组astate 21 25记录嬉戏区域中被标志的矩形。 俄罗斯方块有7个部件，每个部件所占的矩形的个数和位置不同，所以建立零件类，然后建立层叠

2、存放7个零件，每个零件包容存储该零件所占的矩形的个数和位置。当替换的零件到底了，就会产生一个新的零件，就部件的被标志的矩形就会赋值给嬉戏区域的数组。 在嬉戏循环函数中，打印正在下落的部件，和已经固定好的部件，还有下一下落的部件。基本学问： html5 css js本嬉戏包括三个文件： rusblock.html：设置元素rusblock.css：设置样式rusblock.js：脚本控制 第一步： 界面的设置和素材的预备 rusblock.html 复制代码代码如下： rusblock 函数sharegame（）var url = + document.url +title = rusblock

3、;window.showmodaldialog（url）; rusblock 开头结束容易一般硬共享到人人 得分 0 其次步：样式rosblock.css 复制代码代码如下： 身体background-color：gray;text-align：center;font-family：&39;times new roman&39;background-image：url（）;h1game-name background-color：white;宽度：100;font-size：x-large;h2，game-score font-size：x-large;背景色彩：白色；game

4、-area 位置：肯定；左：10;宽度：80;高度：99;canvasgame-canvas background-color：white;宽度：80;高度：98;向左飘浮;button-area，score-area width：10;高度：100;向左飘浮;button-game-start，button-game-end，button-game-share，select-game-level width：100;高度：10;font-size：更大;border-right-width：3px;背景色彩：白色；select-game-level 宽度：100;高度：100;font-si

5、ze：x-large;边框色彩：灰色； 第三步： 编写js代码rusblock.js rusblock类包括的成员解析： 数据： ncurrentcomid：当前放置部件的id astate 21 25：存储嬉戏区域状态的 当前current：当前放置的部件 nextcom：下一部件 ptindex：下落当前的部件相对嬉戏区域的索引 函数： newnextcom（）：产生新的下一部件 nextcomtocurrentcom（）：将下一部件的数据转移到当前下落的部件上 candown（）：推断当前部件是否还可以分解 cannew（）：推断是否还可以产生新的部件 left（）：当前部件向左移动 right（）：当前部件向右移动 rotate（）：当前部件顺时针旋转 acceleratet（）：当前部件向下