为了达到最精简的写法,整个程序的运行是围绕着位操作进行的。
一共用了不到100代码(常规写法),实现了最基本的变形、下落、消除、积分的功能。
操作:
上(变形),下(加速),左(左移),右(右移),空格(落到底)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<style>
GBody {width:241px;height:401px;display:block;background-color:black;}
GSpan {background-color:gray;float:left;width:12px;height:12px;border:4px gray outset;margin:0 1 1 0;overflow:hidden;}
</style>
<script>
//By: X!ao_f QQ:120000512
var G = {
s:0,
f:[],
m:[],
v:[0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0x801,0xFFFF],
d:[[0xCC00],[0x4444,0xF0],[0x8C40,0x6C00],[0x4C80,0xC600],[0x44C0,0x8E00,0xC880,0xE200],[0x88C0,0xE800,0xC440,0x2E00],[0x4E00,0x8C80,0xE400,0x4C40]],
init:function(c){
c = c.appendChild(document.createElement("GBody"));
for(var i=0;i<240;i++){
G.f.push(c.appendChild(document.createElement("GSpan")));
}
document.onkeydown=function(e){G.event(e||window.event,0)};
G.next();
setInterval("G.timeTesk()",500);
},
timeTesk:function(){
if(!G.move(G.x, G.y+1, G.t)){
var s = 0;
for(var i=0;i<20;i++){
G.v[i]=G.v[i]|G.m[i];
if(G.v[i]==0xFFF){
for(var k=i;k>0;k--){
G.v[k] = G.v[k-1];
}
G.s+=++s;
}
}
G.next();
return false;
}
G.draw();
return true;
},
move:function(x,y,t){
var m = [];
for(var k=0;k<4;k++){
m[y+k] = (G.d[G.n][t]>>(3-k)*4&0xF)<<Math.max(x,0)>>-Math.min(x,0);
if(m[y+k] & G.v[y+k]){
return false;
}
}
G.x = x;
G.y = y;
G.t = t;
G.m = m;
G.draw();
return true;
},
next:function(){
var i = 0;
G.n = parseInt(Math.random()*G.d.length);
G.t = parseInt(Math.random()*G.d[G.n].length);
while(!(G.d[G.n][G.t]>>i*4&0xF))i++;
if(!G.move(3, i-3, G.t)){
alert('Game over!');
}
},
draw:function(){
for(var i=0;i<240;i++){
if((G.v[parseInt(i/12)]>>(11-i%12))&0x1||(G.m[parseInt(i/12)]>>(11-i%12))&0x1){
G.f[i].style.visibility = '';
}else{
G.f[i].style.visibility ='hidden';
}
}
document.title = 'score:'+G.s;
},
event:function(e,t){
switch(e.keyCode){
case 37:
G.move(G.x + 1, G.y, G.t);
break;
case 39:
G.move(G.x - 1, G.y, G.t);
break;
case 38:
G.move(G.x, G.y, (G.t + 1) % G.d[G.n].length);
break;
case 40:
G.timeTesk();
break;
case 32:
while(G.timeTesk());
}
}
}
</script>
<body onload='G.init(document.body);'></body>
</html>
分享到:
相关推荐
【jQuery 游戏 俄罗斯方块 代码】是一款基于JavaScript库jQuery实现的网页版俄罗斯方块游戏。这个游戏的特色在于其简洁高效的代码实现,通过利用jQuery的事件处理和DOM操作功能,使得开发者可以用相对较少的代码量...
在“javascript俄罗斯方块.zip”这个压缩包中,应该包含了完整的源代码,包括HTML文件、CSS样式表和JavaScript脚本。你可以通过查看这些文件来学习实际的代码实现。同时,这也是一个很好的学习资源,可以帮助你理解...
总的来说,通过实现俄罗斯方块这款游戏,开发者不仅可以巩固JavaScript基础知识,还能提升动态效果处理、DOM操作、算法设计、代码组织和优化等多方面技能,为后续的大型网页游戏开发奠定坚实基础。而"codesc.net"这...
在JavaScript中,游戏循环、方块移动、旋转、消除行等核心功能都是通过JavaScript代码实现的。 2. **窗口类**: 这个类通常用于表示游戏的主视图,包括游戏区域的大小、颜色设置以及与用户的交互接口。窗口类可能会...
俄罗斯方块的源代码可能是用C++、Python、Java、JavaScript等常见编程语言编写的。每种语言都有其特点,例如C++提供了低级别的内存控制,适合高性能的游戏;Python则以其简洁易读的语法著称,适合快速开发;而Java和...
综上所述,这段HTML代码结合JavaScript实现了俄罗斯方块游戏的基本框架,通过定义游戏板、方块数据、颜色方案和关键的游戏逻辑函数,为学习者提供了一个良好的起点,深入理解游戏开发中的各种技术细节。
JavaScript实现的俄罗斯方块是一款基于浏览器的经典游戏,它利用了JavaScript这门强大的客户端脚本语言,为用户在网页上提供了一种重温经典游戏的方式。在本文中,我们将深入探讨JavaScript如何构建这样的游戏,并...
JavaScript 俄罗斯方块是一款经典的基于JavaScript编程的游戏,它主要用于学习和实践面向对象编程中的类概念。在这款游戏中,开发者可以通过创建不同的类来实现游戏的核心功能,如方块、游戏板、分数显示等。以下是...
本文介绍了用HTML+JavaScript技术制作俄罗斯方块的demo,包含了核心的板块,比较详细易懂,记分功能和闯关功能有兴趣的可以尝试 我还有这方面的代码可以分享
JavaScript版的俄罗斯方块是一款基于Web的休闲游戏,利用了JavaScript这一广泛应用于网页开发的脚本语言。在本文中,我们将深入探讨JavaScript编程基础、HTML布局、CSS样式以及如何将这些技术结合实现俄罗斯方块的...
在本项目中,我们探索的是一个使用纯JavaScript实现的简单版俄罗斯方块游戏。这个项目旨在帮助开发者加深对JavaScript语言的理解,以及如何将其应用于游戏开发。以下是对该项目中涉及的关键知识点的详细说明: 1. *...
总的来说,这款jQuery网页版俄罗斯方块游戏通过结合HTML、CSS和JavaScript,充分利用jQuery库的优势,实现了经典游戏在网页上的重现。它展示了如何用现代Web技术创建交互性强的在线娱乐项目,同时也为学习者提供了...
JavaScript俄罗斯方块游戏源码是一个非常适合初学者和进阶者探索JavaScript编程的项目。通过分析和理解这个游戏的源代码,你可以深入理解JavaScript的基础语法、事件处理、定时器、DOM操作以及游戏逻辑等重要概念。 ...
五年前用Js写的俄罗斯小方块 刚刚修改了下使其支持...地址:http://www.topnorth.cn/upload/rects.html 或者打开 http://www.topnorth.cn 进javascript栏目,javascript俄罗斯方块里可以看到。 看看吧,现丑现丑!!:)
在这个"全新版vue.js俄罗斯方块"项目中,开发者利用Vue.js的强大功能,结合算法,创建了一个完整的俄罗斯方块游戏。让我们深入探讨这个项目中的关键知识点。 1. **Vue.js组件化开发**: - Vue.js的核心理念是组件...
这是一个用 JavaScript 实现的俄罗斯方块游戏,具有简洁的界面和丰富的功能。游戏界面包含游戏区域、开始按钮和得分显示。玩家可以通过键盘操作控制方块的移动和旋转。代码实现了方块形状和颜色的随机生成、游戏板的...
javascript编写的俄罗斯方块 可以设置等级,宽度等相关属性
在压缩包中的 "JavaScript_使用javascript+phaser开发的小游戏之俄罗斯方块" 文件中,应该包含了实现以上功能的源代码。通过阅读和分析代码,你可以学习到如何结合 JavaScript 和 Phaser 实现游戏逻辑,以及如何组织...
如今,随着HTML5技术的发展,我们可以利用HTML、CSS和JavaScript这三种前端技术来实现一款在网页上运行的俄罗斯方块游戏。下面,我们将详细探讨如何通过这些源码文件来理解并学习制作H5版的俄罗斯方块。 1. HTML...
《JavaScript实现的俄罗斯方块源码解析》 俄罗斯方块是一款经典的电子游戏,自1984年诞生以来,就以其简洁的规则和无尽的挑战性吸引了无数玩家。在这个数字化时代,用JavaScript来实现俄罗斯方块是一个很好的编程...