别踩白块儿游戏大全|别踩白块儿最新版下载_极光下载站
热门推荐：
您的位置： - 别踩白块儿 合集
别踩白块儿游戏大全|别踩白块儿最新版下载
别踩白块儿系列是集合了别踩白块儿最新版本，别踩白块儿1-6，别踩白块儿9，别踩白块儿10，还有3D版等等。游戏介绍：别踩白块儿是一款简单而有趣的休闲类游戏。主要考验玩家的极限反应能力，通过不断的踩着黑色方块前进。你能在最短时间内踩多少块？赶紧下载挑战自己的极限。
新别踩白块儿10是一款非常经典的休闲游戏。玩法简单，只需要点击屏幕上的彩色块，就可以前进。不
别踩白块儿5 white Tile 5是一款非常耐玩的休闲类游戏。玩法简单，只需要点击屏幕上的黑块或着彩
别踩白块儿4是一款非常耐玩的休闲类游戏。与之前的《别踩白块儿》相比，增加全23种全新的游戏模式
别踩白块儿2破解版 Piano Tiles 2已修改为无限爱心，以及解锁所有音乐。作为《别踩白块儿》的续作
别踩白块儿2 Piano Tiles 2是休闲游戏《别踩白块儿》的续作。游戏加入下最悦耳的钢琴音乐，伴随音
[b]《别踩白块儿》[/b]是一款休闲游戏，游戏的规则很简单，别踩白块儿，这就是这个游戏唯一的一个
《新别踩白块儿10》是一款非常经典的休闲游戏，游戏操作更流畅，更刺激，唯一不变的规则是，不要
《别踩白块儿3D版 DontTapTheWhiteTile3D》是一款全新的别踩白块游戏，颠覆了经典的模式，最新3D
全新别踩白块儿6是一款受欢迎耐玩的休闲益智游戏，别踩白块儿玩家们还等什么呢?拥有28种(25+3)精
全新的别踩白块儿9上线了，不仅给大家带来64种模式，还给用户带来不一样的好心情。
这是一款极其
[b]《点击2048！别踩空白块儿！》[/b]玩过[url=/search.asp?s=0&m=%24tag%3Am
专题标签相关资讯
Copyright &
. All Rights Reservedjavascript实现别踩白块儿小游戏程序
投稿：hebedich
字体：[ ] 类型：转载 时间：
我们先看到的未开始的页面黑色和白色方块是随机生成的，完了这么多把没有发现时固定不变的。点击一次方块，程序需要判断是黑色还是白色的。如果是黑色的，当然程序也是实现了一次自减，在动画中是实现一次下移的，下移的时候点击的方块到黄颜色的区域会变成灰色
最近有朋友找我用JS帮忙仿做一个别踩白块的小游戏程序，但他给的源代码较麻烦，而且没有注释，理解起来很无力，我就以自己的想法自己做了这个小游戏，主要是应用JS对DOM和数组的操作。
程序思路：如图：将游戏区域的CSS设置为相对定位、溢出隐藏;两块“游戏板”上分别排布着24块方格，黑色每行随机产生一个，“游戏板”向下滚动并交替显示，将每个操作板的黑块位置存入数组，每次点击时将数组pop出来进行比对（我觉得亮点在这……）。
这里是游戏的GitHub地址，大家可以到里点击中部菜单最右边的的Download ZIP按钮下载到桌面一试，HTML和JS，无需服务器。
以下是具体实现，关键部分有注释。
&!DOCTYPE html&
&head&&title&别踩白块&/title&&/head&
&div id="gameZone"&&div id="boardb" style="position:top: 0"&&/div&&/div&//初始化一个boardb,使ab同时存在
代码如下:*{margin: 0padding: 0box-sizing: border-}& //简单的reset一下,并用box-sizing设置盒子尺寸将边框也计算进去,便于后面计算小方块位置
#gameZone{width: 302height: 602border: 1margin: 20position:overflow:} //游戏区域，多两个像素是为了除去边框外还有足够的300*600的空间
.square{width: 75height: 100float:border: 1}
.squareBlack{width: 75height: 100border: 1float:background:}//每个小方块为75*100，并且设置黑色小方块的背景色。
&这里分函数介绍：
全局变量初始化
var loc=600;//黑块落地失败判定
var count=0;//初始化击中黑块总数
var locArr=[];//初始化游戏板上黑块位置的
var order=(function(){
　　　　var ord="A";
　　　　return function(){
　　　　if(ord=='boarda')ord='boardb';
　　　　else ord='boarda';
//用闭包函数使每次创建的游戏板的ID为boarda与boardb，其实用一个全局变量也行，不过为了有点逼格。。。
每次点击判定结果的函数
function judge(){
　　　　var num=this.id.substr(3)//获取元素的ID号
　　　　if(num!=locArr.pop()){ //与位置数组pop出的对比
　　　　　　　　clearTimeout(timer);
　　　　　　　　alert("你的得分为："+count+"分！");
　　　　　　　　 //失败清除定时器，结算分数。
　　　　}else{
　　　　　　　　loc+=100;
　　　　　　　　this.style.background="silver";
　　　　　　　　count+=1;//成功将落地标志加方格的高度，将方格背景色改变一下，击中数+1
　　　　if(count!=0&&count%15==0){
　　　　　　　　clearTimeout(timer);
　　　　　　　　newtimer=50-count/15*5;
　　　　　　　　timer=setInterval('fall()',newtimer);
　　　　}//每击中15个后将速度加快一点，这个式子可自行定义。
产生大框中小黑框位置的随机数，每次创建游戏板时调用此函数，根据产生数定义小黑块的位置
function generateRand(){
　　　　var numArr=[];
　　　　for(var j=0;j&6;j++){
　　　　　　　　var num=Math.floor(Math.random()*4)+j*4;
　　　　　　　　numArr.push(num);
　　　　return numA
每次调用在游戏区域的上方生成一个待往下滚动的游戏板，并将其黑色的部分的数字PUSH进locArr中
function drawBoard(){
　　　　var temArr=generateRand();//这里应用一个临时的位置数组，为了防止两块游戏板之间的位置冲突。
　　　　locArr=temArr.concat(locArr);//将临时数组相连到全局位置数组中
　　　　var board=document.createElement('div');
　　　　board.setAttribute('id',order());
　　　　board.style.position="absolute";
　　　　board.style.top='-600px';
　　　　for(var i=0;i&24;i++){
　　　　　　　　var ele=document.createElement('div');
　　　　　　　　ele.setAttribute('id',"ele"+i);
　　　　　　　　if(temArr.indexOf(i)&-1){
//判断当前创建的小方块的ID序列是否属于临时位置数组
　　　　　　　　　　　　ele.setAttribute('class','squareBlack')
　　　　　　　　}else{
　　　　　　　　　　　　ele.setAttribute('class','square');
　　　　　　　　}
　　　　　　　　ele.addEventListener('click',judge,false); //给每一个小方格添加点击判定函数judge
　　　　　　　　board.appendChild(ele);
　　　　var gameZone=document.getElementById('gameZone');
　　　　gameZone.appendChild(board);
找到脚本中存在的两个游戏板，使其往下滚动
function fall(){
　　　　gameZone=document.getElementById('gameZone');
　　　　var boarda=document.getElementById('boarda');//因为ab两个游戏板全局一直存在，所以不需要定义找不到时的逻辑
　　　　var anowtop=parseInt(boarda.style.top);//因为获取到的top位置是xxxpx类型，所以用一个parseInt()将其转换为整数便于处理。
　　　　if(anowtop==595){ //这里数目为595而不是600是因为在这一帧删除后，下一帧正好600px，刚好使两块游戏板衔接完好。
　　　　　　　　gameZone.removeChild(boarda);
　　　　　　　　drawBoard();//删除游戏区域的游戏板，并在最上方新生成一个。
　　　　anowtop+=5;
　　　　boarda.style.top=anowtop+"px";
　　　　var boardb=document.getElementById('boardb');
　　　　var bnowtop=parseInt(boardb.style.top);
　　　　if(bnowtop==595){
　　　　　　　　gameZone.removeChild(boardb);
　　　　　　　　drawBoard();
　　　　bnowtop+=5;
　　　　boardb.style.top=bnowtop+"px";
　　　　loc-=5;
　　　　if(loc==0){
　　　　　　　　clearTimeout(timer);
　　　　　　　　alert("你的得分为："+count+"分！");
　　　　　　　　
　　　　} //每一帧将落地判定减5，当落地判定为0时表示落地，结算分数。
将主体调用写在window.onload函数里，使得页面的游戏区域加载完成后再调用函数。
window.onload=function(){
　　　　drawBoard();
　　　　fall();
　　　　var timer=setInterval('fall()',50);
增加页面UI：因为一开始的HTML特别简单，所以UI也很好修改，设置按钮，点击触发开始函数。
改变游戏难度：修改setInterval的值，也可以对judge函数内的间隔数目进行修改，或将下落加速的表达式优化一下。
增加比分排行等：用ajax连接服务器，在游戏结束后将结果写入数据库，并引用数据中的排行榜。
改为街机模式：去除定时，修改judge函数，使其每次点击游戏板下落一个小方格的高度。设置总数，开始计时，结束计时。
您可能感兴趣的文章:
大家感兴趣的内容
12345678910
最近更新的内容
常用在线小工具《别踩白块儿》攻略大全:高手教你怎么拿高分__新浪游戏_新浪网
《别踩白块儿》攻略大全:高手教你怎么拿高分
　　《别踩白块儿》是一款最近很火的益智游戏，这游戏玩起来非常简单但是也非常有挑战性，游戏的玩法就像游戏的名字一样，不要踩白色的方块。怎么样，听起来是不是很简单那，那你就错啦。游戏的模式很丰富，分为三种游戏模式，分别是经典模式、街机模式、禅模式。下面小编就来给大家说说这三种模式的玩法，以及拿高分的技巧。
　　别踩白块儿经典模式：
　　玩法介绍：以最快的速度到达终点
　　高分技巧：这个模式同学们注意一下上面有个多少秒，实际上这个模式是设定一段距离，在这个距离内点完之后我们用的时间越短成绩则越好。
　　首先你要把手机放在桌上固定好，然后食指疯狂点，有炫舞或劲舞游戏经验的，突破七秒很容易。还有一种方法，如果是小米手机，请打开手套模式，这要按的时候手机反应会快一点，但是这是双刃剑，也很容易挂掉。
　　别踩白块儿街机模式：
　　玩法介绍：你有能力得多少分就得多少分，没有任何限制，这也是最具挑战性的一个模式
　　高分技巧：再来就是街机模式，虽然俺们打街机真的不行，但还是说说我的方法，前面一百个大家一般都能过，速度稳定下来后，大家出错都是因为按到了白块儿而gameover，所以我们可以默数，一竖有两个就默数“一二”，有三个默数“一二三”，只要就能尽量降低失误率。还有就是视线尽量放在屏幕前段，但不要局限于一点。
　　别踩白块儿禅模式
　　玩法介绍：在30秒内看你能走几步，我玩到了86步，你呢？
　　高分技巧：本关不求快但求稳，千万不要着急，看准下手才是良策。本关由于用时比较久，且正确性很关键，小编建议用双手的大拇指配合操作，这样误操作率最低。由于没有速度限制，玩家很容易越点越快，被自己打乱节奏。一定要耐心稳住，尤其在尤其后期，更是不能慌，以免功亏一篑。
　　以上就是小编目前总结的《别踩白块儿》高分技巧，如果你有更好的方法欢迎在下面的评论告诉我们。
& 15:46:44
& 15:43:40
& 14:03:40
& 17:10:42
& 16:12:34
& 14:13:52
& 14:13:52
　　中国网络游戏排行榜(China Game Weight Rank)是由新浪游戏推出的目前国内最全面、最专业、最公正的最新网络游戏评测排行榜，涵盖内所有新游戏，力图为中国游戏玩家打造最值得信赖的新网游推荐平台。
　　新浪中国网络游戏排行榜是以由新浪游戏专业评测员组成的评测团队为核心，以游戏的画质、类型、风格、题材等游戏特性为依据，对中国(大陆港澳台)、欧美、日韩等地区正在进行测试或正式运营的新网游产品进行评测并打分后产生的权威游戏排行榜。新浪中国网络游戏排行榜将网络游戏从六大项、二十八个小分项与同类游戏进行横向比较，再将该游戏与自身的不同版本进行纵向对比后，由评测中心根据加权平均数得出最后的游戏分数，并以游戏测试及上线时间点为分组，根据每款游戏的CGWS分数在每个季度发布排行榜榜单，实现了排行榜的透明化和实时化，帮助玩家准确、迅速地找到心目中的理想游戏。
　　评天下游戏、测产品深浅―新浪中国网络游戏排行榜CGWR！　
Copyright &
SINA Corporation, All Rights Reserved