一个有意思的 hta 程序 (html application)

时间:2024-03-09 13:18:07

哈哈,刚才同事给我讲了一个hta 程序,他自己说最近在学html5 开发坦克大战,不错,这种好奇心, 好学的精神值得我这个程序员学习,感觉他的视野面比我这个程序员还广,有点小惭愧。

什么是hta 呢?(其实说白了,就是html+javascript +css)只不过,宿主环境不是浏览器,而是桌面程序!!

 

百度百科:

HTA是HTML Application的缩写(HTML应用程序),是软件开发的新概念,直接将HTML保存成HTA的格式,就是一个独立的应用软件,与VB、C++等程序语言所设计的软件界面没什么差别

HTA属性

编辑
HTA与普通的网页结构差不多,所以设计出来很容易,当然HTA还有许多自己独特的属性:

程序的权限

HTA虽然用HTML、JS和CSS编写,却比普通网页权限大得多。它具有桌面程序的所有权限(读写文件、操作注册表等)。HTA本来就是被设计为桌面程序的。

语法的要求

HTA对语法的要求比HTML还要松,甚至连<html>、<body>等标记都可以省略:
下面是一个hta写的迷宫游戏:
<HTML>
<HEAD>
<TITLE>勇闯迷宫   作:VBS脚本之家</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
</HEAD>
<BODY>
<BASEFONT face=verdana size=2>
<SCRIPT>
function ShowMenu(bMenu) {
document.all.idFinder.style.display = (bMenu) ? "none" : "block"
document.all.idMenu.style.display = (bMenu) ? "block" : "none"
idML.className = (bMenu) ? "cOn" : "cOff"
idRL.className = (bMenu) ? "cOff" : "cOn"
return false
}
</SCRIPT>

<STYLE>A.cOn {
	FONT-WEIGHT: bolder; TEXT-DECORATION: none
}
#article {
	PADDING-RIGHT: 15pt; PADDING-LEFT: 5pt; BACKGROUND: white; PADDING-BOTTOM: 0px; FONT: 12pt Verdana, geneva, arial, sans-serif; COLOR: black; PADDING-TOP: 10pt
}
#article P.start {
	TEXT-INDENT: 0pt
}
#article P {
	MARGIN-TOP: 0pt; FONT-SIZE: 10pt; TEXT-INDENT: 12pt
}
#article #author {
	MARGIN-BOTTOM: 5pt; TEXT-INDENT: 0pt; FONT-STYLE: italic
}
#pageList P {
	PADDING-TOP: 10pt
}
#article H3 {
	FONT-WEIGHT: bold
}
#article DL {
	FONT-SIZE: 10pt
}
UL {
	FONT-SIZE: 10pt
}
OL {
	FONT-SIZE: 10pt
}
</STYLE>

<SCRIPT>
<!--
function addList(url,desc) {
if ((navigator.appName=="Netscape") || (parseInt(navigator.appVersion)>=4)) {
var w=window.open("","_IDHTML_LIST_","top=0,left=0,width=475,height=150,history=no,menubar=no,status=no,resizable=no")
var d=w.document
if (!w._init) {
d.open()
d.write("<TITLE>Loading...</TITLE><EM>Loading...</EM>")
d.close()

w.opener=self
window.status="Personal Assistant (Adding): " + desc
} else {
window.status=w.addOption(url,desc)
w.focus()
}
}
else
alert("Your browser does not support the personal assistant.")
return false
}
</SCRIPT>

<STYLE type=text/css>#board TD {
	FONT-SIZE: 2pt; WIDTH: 15pt; HEIGHT: 15pt
}
TD.foot {
	FONT-SIZE: 10pt
}
#board TD.start {
	BORDER-TOP: black 2px solid; FONT-SIZE: 8pt; BACKGROUND: yellow; BORDER-LEFT: black 2px solid; COLOR: red; TEXT-ALIGN: center
}
#board TD.end {
	FONT-SIZE: 8pt; COLOR: green; TEXT-ALIGN: center
}
#message {
	PADDING-RIGHT: 0pt; PADDING-LEFT: 0pt; PADDING-BOTTOM: 0pt; MARGIN: 0pt; PADDING-TOP: 0pt; TEXT-ALIGN: center
}
</STYLE>

<SCRIPT language=JavaScript>
    var maze = new Array()
    var sides = new Array("Border-Top", "Border-Right")
    for (var rows=0; rows<13; rows++)
      maze[rows] = new Array()
    maze[0][0] = new Array(1,1,1,1,1,1,1,1,1,1,1,1)
    maze[0][1] = new Array(0,0,1,0,1,0,0,0,0,1,0,1)
    maze[1][0] = new Array(1,0,0,0,1,0,1,1,1,0,1,1)
    maze[1][1] = new Array(0,1,1,0,0,1,1,0,0,1,0,1)
    maze[2][0] = new Array(1,0,1,0,1,0,0,1,1,0,1,1)
    maze[2][1] = new Array(0,0,0,0,1,1,1,0,0,0,0,1)
    maze[3][0] = new Array(0,1,1,1,1,1,0,0,0,0,1,1)
    maze[3][1] = new Array(1,0,0,1,0,0,0,1,1,0,0,1)
    maze[4][0] = new Array(0,0,0,0,0,0,1,1,1,1,1,1)
    maze[4][1] = new Array(1,1,1,1,1,0,0,0,0,0,1,1)
    maze[5][0] = new Array(0,0,0,0,1,0,1,1,1,1,0,0)
    maze[5][1] = new Array(1,1,1,1,1,1,0,0,0,1,0,1)
    maze[6][0] = new Array(0,0,0,0,0,0,1,1,0,1,0,1)
    maze[6][1] = new Array(1,1,1,1,1,1,0,0,0,1,0,1)
    maze[7][0] = new Array(1,0,1,0,0,0,1,0,1,1,0,1)
    maze[7][1] = new Array(1,1,1,0,1,0,0,1,0,1,1,1)
    maze[8][0] = new Array(0,0,0,1,0,0,1,1,0,0,0,0)
    maze[8][1] = new Array(0,1,0,1,1,0,0,0,1,1,0,1)
    maze[9][0] = new Array(0,0,0,0,0,1,1,1,1,0,1,1)
    maze[9][1] = new Array(1,1,1,1,0,0,0,0,0,1,1,1)
    maze[10][0] = new Array(0,0,0,0,0,1,1,1,1,1,0,0)
    maze[10][1] = new Array(1,1,1,0,1,0,0,0,0,1,0,1)
    maze[11][0] = new Array(0,0,1,1,1,1,1,1,1,0,0,0)
    maze[11][1] = new Array(1,0,1,0,0,0,0,0,0,0,1,1)
    maze[12][0] = new Array(0,0,0,0,0,1,1,1,1,0,1,0)
    maze[12][1] = new Array(1,1,0,1,0,0,0,1,0,0,1,1)

    function testNext(nxt) {
      if ((board.rows[start.rows].cells[start.cols].style.backgroundColor=="blue") && (nxt.style.backgroundColor==\'blue\')) {
        message.innerText="I see you changed your mind."
        board.rows[start.rows].cells[start.cols].style.backgroundColor=""
        return false
      }
      return true
    }

    function moveIt() {
      if (!progress) return
      switch (event.keyCode) {
        case 37: // left
          if (maze[start.rows][1][start.cols-1]==0) {
            if (testNext(board.rows[start.rows].cells[start.cols-1]))
              message.innerText="Going west..."
            start.cols--
            document.all.board.rows[start.rows].cells[start.cols].style.backgroundColor="blue"
          } else
          message.innerText="Ouch... you can\'t go west."

          break;
        case 38: // up
          if (maze[start.rows][0][start.cols]==0) {
            if (testNext(board.rows[start.rows-1].cells[start.cols]))
              message.innerText="Going north..."
            start.rows--
            document.all.board.rows[start.rows].cells[start.cols].style.backgroundColor="blue"
          } else
          message.innerText="Ouch... you can\'t go north."

          break;
        case 39: // right

          if (maze[start.rows][1][start.cols]==0) {
            if (testNext(board.rows[start.rows].cells[start.cols+1]))
              message.innerText="Going east..."
            start.cols++
            document.all.board.rows[start.rows].cells[start.cols].style.backgroundColor="blue"
          }
          else
          message.innerText="Ouch... you can\'t go east."

          break;
        case 40: //down
          if (maze[start.rows+1]==null) return
          if (maze[start.rows+1][0][start.cols]==0) {
            if (testNext(board.rows[start.rows+1].cells[start.cols]))
              message.innerText="Going south..."
            start.rows++
            document.all.board.rows[start.rows].cells[start.cols].style.backgroundColor="blue"
          } else
          message.innerText="Ouch... you can\'t go south."

          break;
      }
      if (document.all.board.rows[start.rows].cells[start.cols].innerText=="end") {
        message.innerText="You Win!"
        progress=false
      }
    }
</SCRIPT>

<P align=center>请使用键盘上的→←↑↓键进行游戏</P><BR>
<P>
<TABLE id=board cellSpacing=0 cellPadding=0 align=center>
  <SCRIPT language=JavaScript>
    for (var row = 0; row<maze.length; row++) {
      document.write("<TR>")

      for (var col = 0; col<maze[row][0].length; col++) {
        document.write("<TD STYLE=\'")
        for (var cell = 0; cell<2; cell++) {
          if (maze[row][cell][col]==1)
            document.write(sides[cell]+": 2px black solid;")
        }
        if ((0==col) && (0!=row))
          document.write("border-left: 2px black solid;")
        if (row==maze.length-1)
          document.write("border-bottom: 2px black solid;")
        if ((0==row) && (0==col))
          document.write(" background-color:yellow;\' class=start>start</TD>")
        else
         if ((row==maze.length-1) && (col==maze[row][0].length-1))
           document.write("\' class=end>end</TD>")
         else
          document.write("\'> </TD>")
      }
      document.write("</TR>")
    }
    var start = new Object
    start.rows = 0
    start.cols = 0
    progress=true
    document.onkeydown = moveIt;
  </SCRIPT>
  <TBODY></TBODY></TABLE>
<P id=message>
</P></BASEFONT>
</BODY>
</HTML>

  运行效果是这样的:

还有一个俄罗斯方块的游戏哦,其实也是html+ javascript + css 实现的呢 :)

源码如下:

 

 

<HTML>
<HEAD>

<title>Tetris</title>
<script>window.resizeTo(410,450)</script>
<style>
<!--
.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
var gameState = 0;

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<10;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(previewWnd.style.display!="none")
        previewWnd.style.display="none";
    else
        previewWnd.style.display="block";
}

function replayGame()
{
    if(gameState!=1)return;
    if(!confirm("Really want to re-start the game?"))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="#EAF0F8" onkeydown="return keyControl();" topmargin="10" leftmargin="10" rightmargin="10" bottommargin="0" scroll=no>
<table border="0" width="100%" cellspacing="0" cellpadding="0" height="100%"><tr><td width="100%" height="100%" align="center">
<table cellspacing=2 cellpadding=0 class=gt border=0 bordercolor="#EAF0F8" bgcolor="#EAF0F8">
<tr>
<td valign="top">
	<table cellspacing=0 cellpadding=0 class=gt border=1 bordercolor="#EAF0F8" style="">
	<Tbody id=GameBar>
	<tr><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap class=BK> 
	</td><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap class=BK> </td><td nowrap 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>
</td>
<td valign="top" align="center" style="padding: 10 10 0 10" bgcolor="#466285">
	<table cellspacing=0 cellpadding=0 border=0>
    <tr><td><font size=5 color=red face=consolas>Tetris</font></td></tr>
	</table>
	<table id="previewWnd" cellspacing=0 cellpadding=0 class=gt border=1 bordercolor="#EAF0F8" bgcolor="#EAF0F8" style="margin-top:15">
	<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 cellspacing=3 cellpadding=0 border=0 style="margin-top:15">
	    <tr><td><input type=button id="Play" style="font-family:Tahoma; font-size:9pt; width:100px" value="Play" onclick="return beginGame();"></td></tr>
	    <tr><td><input type=button id="Pause" style="font-family:Tahoma; font-size:9pt; width:100px" value="Pause" onclick="return pauseGame();"></td></tr>
	    <tr><td><input type=button id="Preview" style="font-family:Tahoma; font-size:9pt; width:100px" value="Preview" onclick="preview();"></td></tr>
	    <tr><td><input type=button id="Replay" style="font-family:Tahoma; font-size:9pt; width:100px" value="Replay" onclick="replayGame();"></td></tr>
	</table>
	<table cellspacing=3 cellpadding=0 border=0 style="font-family:Tahoma; font-size:9pt; font-weight: bold; margin-top:10">
	    <tr><td id=scoreBar style="color:#FFFFFF">Score : 0</td></tr>
	    <tr><td id=speedBar style="color:#FFFFFF">Speed : 1</td></tr>
	</table>
</td>
</tr>
</table>
</td></tr></table>
</BODY>
</HTML>
<script>
function unSel()
{
    document.execCommand("Unselect");
    window.setTimeout("unSel()",100);
}
unSel();


</script>