当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JS编写的俄罗斯方块

Javascript
页面中body onload 和 window.onload 冲突的问题的解决
OnFocus与OnBlur的例子区别
javascript cloneNode()方法的使用
Javascript 文件夹选择框的两种解决方案
JQuery 风格的HTML文本转义
javascript 验证码生成代码 推荐学习
javascript new 需不需要继续使用
javascript 操作文件 实现方法小结
JavaScript 注册表访问实现代码
javascript web页面刷新的方法收集
Javascript 遍历对象中的子对象
javascript 具名函数的四种调用方式 推荐
javascript 写类方式之一
javascript 写类方式之二
javascript 写类方式之三
javascript 写类方式之四
javascript 写类方式之五
javascript 写类方式之六
javascript 写类方式之七
javascript 写类方式之八

No. « 143 144 145 146 »

技术文章搜索

关键字

Javascript 中的 JS编写的俄罗斯方块

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2009-08-10   浏览: 322 ::
收藏到网摘: n/a

<HTML>
<HEAD>
<title>俄罗斯方块</title>
<style>
<!--
BODY
{
}
.MB
{
    BACKGROUND-COLOR: firebrick;
    CURSOR: default;
    HEIGHT: 22px;
    WIDTH: 22px
}
.SB
{
    BACKGROUND-COLOR: slategray;
    CURSOR: default;
    HEIGHT: 22px;
    WIDTH: 22px
}
.BK
{
    BACKGROUND-COLOR: white;
    CURSOR: default;
    HEIGHT: 22px;
    WIDTH: 22px
}
.GT
{
    BORDER-BOTTOM: deepskyblue thin solid;
    BORDER-LEFT: deepskyblue thin solid;
    BORDER-RIGHT: deepskyblue thin solid;
    BORDER-TOP: deepskyblue thin solid;
    CURSOR: default
}
-->
</style>
<script>
<!--
var BX=new Array(4);
var BY=new Array(4);
var PX=new Array(4);
var PY=new Array(4);
var mTimer
var firstView

function beginGame()
{
    gameState=0;
    speed=1;
    outTime=1100-speed*100;
    score=0;
    if(gameState!=0)return;
    firstView=true;
    for(j=0;j<16;j++)
        for(i=0;i<10;i++)
            setClass(i,j,"BK");
    randBar();
    gameState=1;
    Play.disabled=true;
    window.clearInterval(mTimer);
    mTimer=window.setInterval("moveBar()",outTime);
}

function keyControl()
{
    if(gameState!=1)return;
    switch(event.keyCode){
        case 37:{    //left
            for(i=0;i<4;i++)if(BX[i]==0)return;
            for(i=0;i<4;i++)if(getClass(BX[i]-1,BY[i])=="SB")return;
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"BK");
            for(i=0;i<4;i++)BX[i]=BX[i]-1;
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"MB");
            break;}
        case 38:{    //up
            var preMBarX=new Array(4);
            var preMBarY=new Array(4);
            var cx=Math.round((BX[0]+BX[1]+BX[2]+BX[3])/4);
            var cy=Math.round((BY[0]+BY[1]+BY[2]+BY[3])/4);
            for(i=0;i<4;i++){
                preMBarX[i]=Math.round(cx-cy+BY[i]);
                preMBarY[i]=Math.round(cx+cy-BX[i]);
                if(preMBarX[i]<0 || preMBarX[i]>9 || preMBarY[i]<0 || preMBarY[i]>15)return;
                if(getClass(preMBarX[i],preMBarY[i])=="SB")return;
            }
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"BK");
            for(i=0;i<4;i++){
                BX[i]=preMBarX[i];
                BY[i]=preMBarY[i];
            }
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"MB");
            break;}
        case 39:{    //right
            for(i=0;i<4;i++)if(BX[i]==9)return;
            for(i=0;i<4;i++)if(getClass(BX[i]+1,BY[i])=="SB")return;
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"BK");
            for(i=0;i<4;i++)BX[i]=BX[i]+1;
            for(i=0;i<4;i++)setClass(BX[i],BY[i],"MB");
            break;}
        case 40:{    //down
            moveBar();
            break;}
    }
}

function delLine()
{
    for(i=0;i<4;i++)setClass(BX[i],BY[i],"SB");
    for(j=0;j<16;j++){
        dLine=true;
        for(i=0;i<9;i++){
            if(getClass(i,j)!="SB"){
                dLine=false;
                break;
            }
        }
        if(dLine){
            score=score+100;
            for(k=j;k>0;k--)
                for(l=0;l<10;l++)
                    setClass(l,k,getClass(l,k-1));
            for(l=0;l<10;l++)setClass(l,0,"BK");
        }
    }
    randBar();
    speed=Math.floor(score/3000)+1;
    outTime=1100-speed*100;
    scoreBar.innerHTML="Score : " + score;
    speedBar.innerHTML="Speed : " + speed;
    window.clearInterval(mTimer);
    mTimer=window.setInterval("moveBar()",outTime);
}

function getClass(x,y){return GameBar.children[y].children[x].className;}
function setClass(x,y,cName){GameBar.children[y].children[x].className=cName;}

function moveBar()
{
    if(gameState!=1)return;
    dropLine=true;
    for(i=0;i<4;i++)if(BY[i]==15)dropLine=false;
    if(dropLine)for(i=0;i<4;i++)if(getClass(BX[i],BY[i]+1)=="SB")dropLine=false;
    if(!dropLine){
        window.clearInterval(mTimer);
        delLine();
        return;
    }
    for(i=0;i<4;i++)setClass(BX[i],BY[i],"BK");
    for(i=0;i<4;i++)BY[i]=BY[i]+1;
    for(i=0;i<4;i++)setClass(BX[i],BY[i],"MB");
}

function pauseGame()
{
    if(gameState==0)return;
    if(event.srcElement.value=="Pause"){
        gameState=2;
        event.srcElement.value="Continue";
        window.clearInterval(mTimer);
    }
    else{
        gameState=1;
        event.srcElement.value="Pause";
        mTimer=window.setInterval("moveBar()",outTime);
    }
}

function fMnu(){return false;}
document.oncontextmenu=fMnu;

function preview()
{
    if(previewBar.style.display!="none")
        previewBar.style.display="none";
    else
        previewBar.style.display="block";
}

function replayGame()
{
    if(gameState!=1)return;
    if(!confirm("你真的要重新开始么？"))return;
    gameState=0;
    window.clearInterval(mTimer);
    beginGame();
}
function randBar()
{
    randNum=Math.floor(Math.random()*20)+1;
    if(!firstView)
        for(i=0;i<4;i++){
            BX[i]=PX[i];
            BY[i]=PY[i];
        }
    switch(randNum){
        case 1:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=4;
            PY[1]=1;
            PX[2]=5;
            PY[2]=1;
            PX[3]=6;
            PY[3]=1;
            break;}
        case 2:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=4;
            PY[2]=1;
            PX[3]=4;
            PY[3]=2;
            break;}
        case 3:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=6;
            PY[2]=0;
            PX[3]=6;
            PY[3]=1;
            break;}
        case 4:{
            PX[0]=5;
            PY[0]=0;
            PX[1]=5;
            PY[1]=1;
            PX[2]=5;
            PY[2]=2;
            PX[3]=4;
            PY[3]=2;
            break;}
        case 5:{
            PX[0]=6;
            PY[0]=0;
            PX[1]=6;
            PY[1]=1;
            PX[2]=4;
            PY[2]=1;
            PX[3]=5;
            PY[3]=1;
            break;}
        case 6:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=4;
            PY[1]=1;
            PX[2]=4;
            PY[2]=2;
            PX[3]=5;
            PY[3]=2;
            break;}
        case 7:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=4;
            PY[1]=1;
            PX[2]=5;
            PY[2]=0;
            PX[3]=6;
            PY[3]=0;
            break;}
        case 8:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=5;
            PY[2]=1;
            PX[3]=5;
            PY[3]=2;
            break;}
        case 9:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=5;
            PY[2]=1;
            PX[3]=6;
            PY[3]=1;
            break;}
        case 10:{
            PX[0]=5;
            PY[0]=0;
            PX[1]=5;
            PY[1]=1;
            PX[2]=4;
            PY[2]=1;
            PX[3]=4;
            PY[3]=2;
            break;}
        case 11:{
            PX[0]=4;
            PY[0]=1;
            PX[1]=5;
            PY[1]=1;
            PX[2]=5;
            PY[2]=0;
            PX[3]=6;
            PY[3]=0;
            break;}
        case 12:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=4;
            PY[1]=1;
            PX[2]=5;
            PY[2]=1;
            PX[3]=5;
            PY[3]=2;
            break;}
        case 13:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=6;
            PY[2]=0;
            PX[3]=5;
            PY[3]=1;
            break;}
        case 14:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=4;
            PY[1]=1;
            PX[2]=4;
            PY[2]=2;
            PX[3]=5;
            PY[3]=1;
            break;}
        case 15:{
            PX[0]=5;
            PY[0]=0;
            PX[1]=5;
            PY[1]=1;
            PX[2]=4;
            PY[2]=1;
            PX[3]=6;
            PY[3]=1;
            break;}
        case 16:{
            PX[0]=5;
            PY[0]=0;
            PX[1]=5;
            PY[1]=1;
            PX[2]=5;
            PY[2]=2;
            PX[3]=4;
            PY[3]=1;
            break;}
        case 17:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=4;
            PY[2]=1;
            PX[3]=5;
            PY[3]=1;
            break;}
        case 18:{
            PX[0]=4;
            PY[0]=0;
            PX[1]=5;
            PY[1]=0;
            PX[2]=4;
            PY[2]=1;
            PX[3]=5;
            PY[3]=1;
            break;}
        case 19:{
            PX[0]=3;
            PY[0]=0;
            PX[1]=4;
            PY[1]=0;
            PX[2]=5;
            PY[2]=0;
            PX[3]=6;
            PY[3]=0;
            break;}
        case 20:{
            PX[0]=5;
            PY[0]=0;
            PX[1]=5;
            PY[1]=1;
            PX[2]=5;
            PY[2]=2;
            PX[3]=5;
            PY[3]=3;
            break;}
    }
    if(firstView){
        firstView=false;
        randBar();
        return;
    }
    for(i=0;i<4;i++){
        for(j=0;j<4;j++){
            previewBar.children[j].children[i].className="BK";
        }
    }
    for(i=0;i<4;i++)previewBar.children[PY[i]].children[PX[i]-3].className="MB";
    for(i=0;i<4;i++){
        if(getClass(BX[i],BY[i])!="BK"){
            alert("Game Over!");
            window.clearInterval(mTimer);
            Play.disabled=false;
            gameState=0;
            return;
        }
    }
    for(i=0;i<4;i++)setClass(BX[i],BY[i],"MB");
}
// -->
</script>
</HEAD>
<BODY bgcolor=Black onkeydown="return keyControl();">
<center>
<P><b><font color=red>俄罗斯方块</font></b></P>
<table cellspacing=0 cellpadding=0 class=gt border=1 bordercolor="LightYellow " style="position:absolute;left:220px;top:53px;">
<Tbody id=GameBar>
<tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr>
</tbody>
</table>
</center>
<table style="position:absolute;top=100px;left:50px">
    <tr><td id=scoreBar style="color:white">Score : 0</td></tr>
    <tr><td id=speedBar style="color:white">Speed : 1</td></tr>
</table>

<table cellspacing=0 cellpadding=0 class=gt border=1 bordercolor="LightYellow " style="position:absolute;left:570px;top:53px;">
<Tbody id=previewBar>
<tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr><tr><td class=BK> </td><td class=BK> </td><td class=BK> </td><td class=BK> </td></tr>
</tbody>
</table>
<table style="position:absolute;left:570px;top:180px;">
    <tr><td><input type=button id="Play" style="width:100px" value="Play" onclick="return beginGame();"></td></tr>
    <tr><td><input type=button id="Pause" style="width:100px" value="Pause" onclick="return pauseGame();"></td></tr>
    <tr><td><input type=button id="Preview" style="width:100px" value="Preview" onclick="preview();"></td></tr>
    <tr><td><input type=button id="Replay" style="width:100px" value="Replay" onclick="replayGame();"></td></tr>
    <tr><td><input type=button id="Quit" style="width:100px" value="Quit" onclick="window.close();"></td></tr>
</table>
<div style="position:absolute;left:590px;top:390px;color:white;font-size:9pt">如有问题请与我<a href="mailto:[email protected]"><font color=white>联系</font></a></div>
</BODY>
</HTML>
<script>
function unSel()
{
    document.execCommand("Unselect");
    window.setTimeout("unSel()",10);
}
unSel();

window.onunload=rel;
function rel()
{
    location.reload();
    return false;
}

</script>