<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>Tetris</title>
<link id="style1" rel="stylesheet" type="text/css" href="Tetris.css" >
<link id="style2" rel="stylesheet" type="text/css" href="Tetris_Blue.css">
<script type="text/javascript">
/***********************************************
// 俄罗斯方块JavaScript版
// 版本：v1.0
// 作者：黄健
// 日期：08.04.07
// Email: freewind22@163.com
// 转载请保留此信息.
************************************************/
var DEF_WIN_WIDTH = 320;
var DEF_WIN_HEIGHT = 260;
//声明命名空间
var Freewind = {};
//基类
Freewind.Base = function(){
//浏览器
this._isIE = document.all ? true : false;
//对象索引
this._nIndex = 0;
//大小
this._nLeft = 0;
this._nTop = 0;
this._nWidth = DEF_WIN_WIDTH;
this._nHeight = DEF_WIN_HEIGHT;
//对象ID前缀
this._sPrefix = "FW_";
//文档对象
this.DOM = document;
//父对象
this._parent = document.body;
//创建Div
this._createDiv = function(sDivID){
var obj = this.DOM.createElement("div");
obj.setAttribute("id", this._sPrefix + sDivID + this._nIndex);
obj.className = this._sPrefix + sDivID;
return obj;
};
this._$ = function(o){
return document.getElementById(o);
};
//获取元素绝对位置
this._getOffset = function(obj){
var x = 0, y = 0;
do{
x += obj.offsetLeft;
y += obj.offsetTop;
obj = obj.offsetParent;
}while(obj);
return {x:x, y:y};
};
};
//窗口类
Freewind.Window = function(){
Freewind.Base.apply(this, arguments);
this._nIndex = this._getIndex();
//移动相关
this._bMouseDown = false;
this._nEventX = 0;
this._nEventY = 0;
//ModlessDialog
this._nAddzIndex = 0;
//对象
this.Window = null;
this._Title = null;
this._Body = null;
this._CloseButton = null;
this._Container = null;
this._OverLayer = null;
this._init();
}
Freewind.Window.prototype = {
//Private method
_initObject : function(){
this.Window = this._createDiv("Window");
this._Container = this._createDiv("Container");
this._Title = this._createDiv("Title");
this._CloseButton = this._createDiv("CloseButton");
this._Body = this._createDiv("Body");
this.Window.appendChild(this._Container);
this._Container.appendChild(this._Title);
this._Container.appendChild(this._Body);
this._Container.appendChild(this._CloseButton);
this._CloseButton.innerHTML = "<span>X</span>";
},
_initPosition : function(){
var left, top, titleHeight;
titleHeight = 30;
this.Window.style.cssText = "position: relative; left:" + this._nLeft + "px; top:" + this._nTop + "px; width:" + this._nWidth + "px; height:" + this._nHeight + "px; z-index:90;";
this._Title.style.cssText = "position: absolute; width:100%; height:" + titleHeight + "px; line-height:" + titleHeight + "px; cursor:move; z-index:11; font-size:12px;";
var t = (titleHeight - 19) / 2 ;
this._CloseButton.style.cssText = "position: absolute; right:8px; width:20px; height:19px; top:" + t + "px; text-align:center; z-index:12; cursor:pointer;";
h = this._nHeight - titleHeight - 1 ;
this._Body.style.cssText = "position:absolute; left:0px; top:" + titleHeight + "px; width:100%; z-index:11; height:" + h + "px;";
},
_setOpacity : function(n){
this.Window.style.MozOpacity = n / 100;
if(n == 100){
this.Window.style.filter = "";
}else{
this.Window.style.filter = "alpha(opacity=" + n + ")";
}
},
_setzIndex : function(str){
if(str == "Top"){
this.Window.style.zIndex = 100 + this._nAddzIndex;
}else if(str == "OverLayer"){
this.Window.style.zIndex = 99 + this._nAddzIndex;
}else{
this.Window.style.zIndex = 90 + this._nAddzIndex;
}
},
_mouseDown : function(oEvent){
oEvent = oEvent || window.event;
this._setzIndex("Top");
this._setOpacity(50);
if(this._isIE){
this._nEventX = oEvent.clientX + document.documentElement.scrollLeft;
this._nEventY = oEvent.clientY + document.documentElement.scrollTop;
}else{
this._nEventX = oEvent.pageX;
this._nEventY = oEvent.pageY;
}
this._bMouseDown = true;
if(this._isIE){
this._Title.setCapture();
}else{
window.captureEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
},
_mouseMove : function(oEvent){
if(this._bMouseDown){
var x, y, ex, ey;
oEvent = oEvent || window.event;
if(this._isIE){
ex = oEvent.clientX + document.documentElement.scrollLeft;
ey = oEvent.clientY + document.documentElement.scrollTop;
}else{
ex = oEvent.pageX;
ey = oEvent.pageY;
}
x = this._nEventX - ex;
y = this._nEventY - ey;
this.Window.style.left = parseInt(this.Window.style.left) - x + "px";
this.Window.style.top = parseInt(this.Window.style.top) - y + "px";
this._nEventX = ex;
this._nEventY = ey;
}
},
_mouseUp : function(){
this._setzIndex("Normal");
this._setOpacity(100);
this._bMouseDown = false;
if(this._isIE){
this._Title.releaseCapture();
}else{
window.releaseEvents(Event.MOUSEMOVE | Event.MOUSEUP);
}
},
_onclick : function(oEvent){
if(this._nAddzIndex > 0){
this.closeDialog();
}else{
this.closeWindow();
}
},
_initEvent : function(){
var objThis = this;
this._Title.onmousedown = function(oEvent){
objThis._mouseDown(oEvent);
};
this._Title.onmousemove = function(oEvent){
objThis._mouseMove(oEvent);
};
this._Title.onmouseup = function(oEvent){
objThis._mouseUp(oEvent);
};
this._CloseButton.onclick = function(oEvent){
objThis._onclick(oEvent);
};
},
_init : function(){
this._initObject();
this._initEvent();
},
_getIndex : function(){
if(this.DOM.nWndCount){
return ++this.DOM.nWndCount;
}else{
this.DOM.nWndCount = 1;
return this.DOM.nWndCount;
}
},
_showOverLayer : function(){
var o;
if(this._OverLayer == null){
this._OverLayer = this._createDiv("OverLayer");
}
o = this._OverLayer;
this._parent.appendChild(o);
//o.style.backgroundColor = "#FF0000";
o.style.width = document.documentElement.clientWidth + "px";
o.style.height = document.documentElement.clientHeight + "px";
},
_hideOverLayer : function(){
this._parent.removeChild(this._OverLayer);
},
//public method
moveTo : function(x, y){
this.Window.style.left = x + "px";
this.Window.style.top = y + "px";
this._nLeft = x;
this._nTop = y;
},
setSize : function(wid, hei){
this._nWidth = wid;
this._nHeight = hei;
this.Window.style.width = wid + "px";
this.Window.style.height = hei + "px";
this._Body.style.height = hei - 30 - 1 + "px";
},
setDefaultSkin : function(){
this._initPosition();
//窗口
this.Window.style.border = "1px solid #76c2eb";
this._Title.style.backgroundColor = "#d4eeff";
this._Title.style.filter = " progid:DXImageTransform.Microsoft.gradient(startcolorstr=#d4eeff,endcolorstr=#fcfdff,gradientType=0);"
this._Title.style.color = "#004b85";
this._Title.style.fontFamily = "Times New Roman";
this._Body.style.borderTop = "1px solid #76c2eb";
this._Body.style.backgroundColor = "#F8F8F8";
//this._CloseButton.innerHTML = "<span style='font-size:14px;color:#004b85;font-family:Arial;font-weight:bold;'>X</span>";
},
setTitle : function(str){
this._Title.innerHTML = " " + str;
},
setBody : function(str){
this._Body.innerHTML = str;
},
setRect : function(left, top){
this._nLeft = left;
this._nTop = top;
if(arguments[2]) this._nWidth = arguments[2];
if(arguments[3]) this._nHeight = arguments[3];
this.moveTo(left, top);
if(arguments.length > 3){
this.setSize(this._nWidth, this._nHeight);
}
},
set
JavaScript 版俄罗斯方块
4星 · 超过85%的资源 需积分: 9 54 浏览量
2008-04-25
17:53:00
上传
评论 1
收藏 11KB RAR 举报 
Tetris.rar （3个子文件） 
Tetris 
Tetris_Blue.css 5KB
Tetris.html 34KB Tetris.css 5KB资源评论
21qweqde2018-03-12可以用，但是没有上操作键的转换功能- lewjone2013-10-17不错，js功底强
- kwy9992013-08-05能做成这样子这东西算是不错的
- C_dsd2013-03-08很不错，就是有点小bug
