【代码接龙】javascript/html/css 版俄罗斯方块

iptton · 发表于 2010-5-20 01:33

RT，有兴趣动手的同学可以把你的代码帖上来。不需要一步完成。

欢迎就代码所有存在的问题拍砖

代码不求兼容所有浏览器，能用得到html5,css3更好！！不过最好能在你的代码前面定明在哪些浏览器下可运行。

以下代码只是临时想到的一个不完整的框架。在ie7 / firefox下没有脚本错误

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
//工具函数
function $(id){return document.getElementById(id);}
//变量
var brickSize=10;
var timer=null;
var interval=200;
var intervalIncreament=.8;
// 创建关卡
function createLevel(l){
clearScene();
for(var i=0;i<l;++i){
createRandomBrick(i);
}
}
//为每行产生随机砖块
function createRandomBrick(line){
}
//清空旧关卡数据
function clearScene(){
$("container").innerHTML="";
}
// 按键事件侦听入口
function onKeyDown(e){
e = e?e:window.event;//ie兼容
var keyCode = e.keyCode;
var keyFunction = keyFunctions[keyCode];
if(keyFunction){
keyFunction();
}
}
//对应各按键的处理函数
var keyFunctions={
'37':function(){//左
alert('左');
},
'38':function(){//上
alert('上');
},
'39':function(){//右
alert('右');
},
'40':function(){//下
alert('下');
}
}
function ticker(){
}
function startGameTimer(){
timer = setInterval(ticker,interval);
}
function stopGameTimer(){
clearInterval(timer);
}
function startGame(level){
level=level?level:0;
createLevel(level);
startGameTimer();
}
function onStartButtonClicked(){
startGame(0);
$("startButton").disabled="disable";
$("pauseButton").disabled="";
}
function onPauseButtonClicked(){
stopGameTimer();
$("startButton").disabled="";
$("pauseButton").disabled="disable";
}
//初始化html元素
function initialDom(){
$("startButton").disabled="";
$("pauseButton").disabled="disable";
}
//初始化事件绑定
function initialEvent(){
document.onkeydown=onKeyDown;
$("startButton").onclick=onStartButtonClicked;
$("pauseButton").onclick=onPauseButtonClicked;
}
window.onload=function(){
initialDom();
initialEvent();
};
</script>
<style>
.centerAlign{
margin:0 auto; /* 有指定宽度时 */
text-align:center;/* 无指定宽度时 */
}
</style>
</head>
<body>
<div id="container" class="centerAlign" style="width:300px;height:400px;border:solid 1px #666;">
</div>
<div class="centerAlign">
<button id="startButton">开始</button>
<button id="pauseButton">暂停</button>
</div>
</body>
</html>

复制代码

		自动登录	找回密码
密码			加入后院