俄罗斯方块游戏,键盘方向键←→控制左右移动,↑键变形,↓键快速下落
?1. [代码]HTML文件
<html><head><title>俄罗斯方块-柯乐义</title>
<link href="http://keleyi.com/game/5/index/keleyielsfk.css" type="text/css" rel="Stylesheet" /></head>
<body><a href="http://keleyi.com/a/bjac/600xsi0s.htm">原文</a></body></html>
<script>
var over = false, shapes = ("0,1,1,1,2,1,3,1;1,0,1,1,1,2,2,2;2,0,2,1,2,2,1,2;0,1,1,1,1,2,2,2;1,2,2,2,2,1,3,1;1,1,2,1,1,2,2,2;0,2,1,2,1,1,2,2").split(";");
function create(tag, css) {
var elm = document.createElement(tag);
elm.className = css;
document.body.appendChild(elm);
return elm;
}
function Tetris(c, t, x, y) {
var c = c ? c : "c";
this.divs = [create("div", c), create("div", c), create("div", c), create("div", c)];
this.reset = function () {
this.x = typeof x != ‘undefined‘ ? x : 3;
this.y = typeof y != ‘undefined‘ ? y : 0;
this.shape = t ? t : shapes[Math.floor(Math.random() * (shapes.length - 0.00001))].split(",");
this.show();
if (this.field && this.field.check(this.shape, this.x, this.y, ‘v‘) == ‘D‘) {
over = true;
this.field.fixShape(this.shape, this.x, this.y);
alert(‘游戏结束。http://keleyi.com/game/5/‘);
}
}
this.show = function () {
for (var i in this.divs) {
this.divs[i].style.left = (this.shape[i * 2] * 1 + this.x) * 20 + ‘px‘;
this.divs[i].style.top = (this.shape[i * 2 + 1] * 1 + this.y) * 20 + ‘px‘;
}
}
this.field = null;
this.hMove = function (step) {
var r = this.field.check(this.shape, this.x - -step, this.y, ‘h‘);
if (r != ‘N‘ && r == 0) {
this.x -= -step;
this.show();
}
}
this.vMove = function () {
if (this.field.check(this.shape, this.x, this.y - -1, ‘v‘) == ‘N‘) {
this.y++;
this.show();
}
else {
this.field.fixShape(this.shape, this.x, this.y);
this.field.findFull();
this.reset();
}
}
this.rotate = function () {
var s = this.shape;
var newShape = [3 - s[1], s[0], 3 - s[3], s[2], 3 - s[5], s[4], 3 - s[7], s[6]];
var r = this.field.check(newShape, this.x, this.y, ‘h‘);
if (r == ‘D‘) return;
if (r == 0) {
this.shape = newShape;
this.show();
}
else if (this.field.check(newShape, this.x - r, this.y, ‘h‘) == 0) {
this.x -= r;
this.shape = newShape;
this.show();
}
}
this.reset();
}
function Field(w, h) {
this.width = w ? w : 10;
this.height = h ? h : 20;
this.show = function () {
var f = create("div", "f")
f.style.width = this.width * 20 + ‘px‘;
f.style.height = this.height * 20 + ‘px‘;
}http://www.huiyi8.com/yinxiao/?
this.findFull = function () {
for (var l = 0; l < this.height; l++) {
var s = 0;
for (var i = 0; i < this.width; i++) {
s += this[l * this.width + i] ? 1 : 0;
}音效网
if (s == this.width) {
this.removeLine(l);
}
}
}
this.removeLine = function (line) {
for (var i = 0; i < this.width; i++) {
document.body.removeChild(this[line * this.width + i]);
}
for (var l = line; l > 0; l--) {
for (var i = 0; i < this.width; i++) {
this[l * this.width - -i] = this[(l - 1) * this.width - -i];
if (this[l * this.width - -i]) this[l * this.width - -i].style.top = l * 20 + ‘px‘;
}
}
}
this.check = function (shape, x, y, d) {
var r1 = 0, r2 = ‘N‘;
for (var i = 0; i < 8; i += 2) {
if (shape[i] - -x < 0 && shape[i] - -x < r1)
{ r1 = shape[i] - -x; }
else if (shape[i] - -x >= this.width && shape[i] - -x > r1)
{ r1 = shape[i] - -x; }
if (shape[i + 1] - -y >= this.height || this[shape[i] - -x - -(shape[i + 1] - -y) * this.width])
{ r2 = ‘D‘ }
}
if (d == ‘h‘ && r2 == ‘N‘) return r1 > 0 ? r1 - this.width - -1 : r1;
else return r2;
}
this.fixShape = function (shape, x, y) {
var d = new Tetris("d", shape, x, y);
d.show();
for (var i = 0; i < 8; i += 2) {
this[shape[i] - -x - -(shape[i + 1] - -y) * this.width] = d.divs[i / 2];
}
}
}
var f = new Field();
f.show();
var s = new Tetris();
s.field = f;
s.show();
window.setInterval("if(!over)s.vMove();", 500);
document.onkeydown = function (e) {
if (over) return;
var e = window.event ? window.event : e;
switch (e.keyCode) {
case 38: //up keleyi.com
s.rotate();
break;
case 40: //down
s.vMove();
break;
case 37: //left
s.hMove(-1);
break;
case 39: //right
s.hMove(1);
break;
}
}
</script>
?
javascript俄罗斯方块游戏
时间: 2024-07-31 14:26:50
javascript俄罗斯方块游戏的相关文章
经典 HTML5 &; Javascript 俄罗斯方块游戏
Blockrain.js 是一个使用 HTML5 & JavaScript 开发的经典俄罗斯方块游戏.只需要复制和粘贴一段代码就可以玩起来了.最重要的是,它是响应式的,无论你的显示屏多么宽都能自动匹配.你可以自定义你想要的颜色以适应您的网站,也可以调整方块落下的速度. 在线演示 源码下载 您可能感兴趣的相关文章 网站开发中很有用的 jQuery 效果[附源码] 分享35个让人惊讶的 CSS3 动画效果演示 十分惊艳的8个 HTML5 & JavaScript 特效 Web 开发中
Javascript 俄罗斯方块 游戏代码解释!
俄罗斯方块代码说明 /** 名称:Javascript 俄罗斯方块! 作者:Gloot 邮箱:[email protected] QQ:345268267 网站:http://www.cnblogs.com/editor/ */ OLSFK = {}; 本俄罗斯方块代码采用 JavaScript 脚本代码写成,简单易懂: 全代码采用静态类及静态变量成员组成: 全脚本通过实现代码全局配置 OLSFK.Options = {...} 定义方块起始坐标及定义各自的旋转点: 从初始化俄罗斯方块界面开始,
60行代码:Javascript 写的俄罗斯方块游戏
先看效果图: 游戏结束图: javascript实现源码: <!doctype html> <html><head><title>俄罗斯方块</title> <meta name="Description" content="俄罗斯方块Javascript实现"> <meta name="Keywords" content="俄罗斯方块,Javascript,
javascript 60行编写的俄罗斯方块游戏
转自 http://www.zuidaima.com/share/1759652641295360.htm <!doctype html><html><head></head><body> <div id="box" style="width:252px;font:25px/25px 宋体;background:#000;color:#9f9;border:#999 20px ridge;text-shadow
【分享】60行代码:Javascript 写的俄罗斯方块游戏
效果如下,可测试: javascript实现源码: <!doctype html> <html><head><title>俄罗斯方块</title> <meta name="Description" content="俄罗斯方块Javascript实现"> <meta name="Keywords" content="俄罗斯方块,Javascript,实现,短
俄罗斯方块游戏JavaScript代码
JavaScript代码俄罗斯方块游戏 早就听说网上有人仅仅用60行JavaScript代码写出了一个俄罗斯方块游戏,最近看了看,今天在这篇文章里面我把我做的分析整理一下(主要是以注释的形式). 我用C写一个功能基本齐全的俄罗斯方块的话,大约需要1000行代码的样子.所以60行乍一看还是很让人吃惊的. 但是读懂了代码之后发现其实整个程序并没有使用什么神秘的技术,只不过是利用一些工具或者JavaScript本身的技巧大大简化了代码. 总结起来主要是以下三点 1.使用eval来产生JavaScrip
教你看懂网上流传的60行JavaScript代码俄罗斯方块游戏
早就听说网上有人仅仅用60行JavaScript代码写出了一个俄罗斯方块游戏,最近看了看,今天在这篇文章里面我把我做的分析整理一下(主要是以注释的形式). 我用C写一个功能基本齐全的俄罗斯方块的话,大约需要1000行代码的样子.所以60行乍一看还是很让人吃惊的. 但是读懂了代码之后发现其实整个程序并没有使用什么神秘的技术,只不过是利用一些工具或者JavaScript本身的技巧大大简化了代码. 总结起来主要是以下三点 1.使用eval来产生JavaScript代码,减小了代码体积 2.以字符串作为
CSS+js打造的网页版俄罗斯方块游戏
<HTML> <SCRIPT> parent.moveTo((screen.width-775)/2,(screen.height-540)/2); parent.resizeTo(775,540) </SCRIPT> <HEAD> <META NAME="Title" CONTENT="JScript Simple Tetris"> <TITLE>CSS+js打造的网页版俄罗斯方块游戏丨石家庄
俄罗斯方块游戏:C语言程序设计初步感受
C语言课程设以一节课,老师提供了一个C语言的俄罗斯方块游戏让我们感受,本学期C语言课程,主要是各种语句的练习,这次是用以前的知识来感受一个实际的系统. 首先安装c-free,然后打开老师所发给我们的小程序. 界面很简单,没想到C语言还能做这么有意思的东西,真是没有想到. 分析一下程序,感觉比较太复杂的,但就是本学期学习的简单语句的组合,运用起来如此神奇. 1.首先是在屏幕上显示的语句printf 2.运用for语句建立窗口 for(i=2;i<2*Frame_width-2;i+=2) { go