복사해서 태그연습장이나 html 문서를 만드세요.
<!--
파일명 : TETRIS.html (JavaScript를 이용한 테트리스 게임)
제작자 : 김연진
제작일 : 2004. 6. 23 Taeyo.Net 사이트에 올라온 소스
수정자 : 강현석
수정일 : 2004. 6. 29.
수정내용 : 본소스에서 테트리스 블럭중 빠진 블럭 2가지(┌┘,└┐)를 추가하고,
몇가지 변수들과 레벨업을 제 나름대로 수정했으며 태그도 조금 손을 보았습니다.
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<script language='javascript'>
var cx = 12; // x 축 크기
var cy = 28; // y 축 크기
var background = "black"; // 백그라운드 색
// 점수를 동시 삭제행이 많을수록 점수가 기하급수적으로 늘어나도록 조정
var scoreRule = new Array(1, 10, 40, 90, 160); // 점수 규칙 ( 행삭제갯수가 0 이면 1, 1이면 10, ... )
// 본인이 너무 빠른 속도에 적응을 못하기 때문에 조금 속도를 늦추면서 단계간의 격차를 일률적으로 조정
var speed = new Array(1000, 700, 490, 343, 240, 168, 117, 82, 57, 40); // 레벨에 따른 속도 ( 레벨1 : 1 초에 1칸, 레벨2 : 0.7초에 한칸 ... )
// 블럭을 모양에 따라 서로 비슷한 색을 띄도록 수정하고 추가된 블럭에 맞게 2가지 색상을 추가
var colors = new Array("#999999", "#3399ff", "#9933ff", "#33ff99", "#99ff33", "#ff9933", "#ff3399"); // 블럭별 색
var x, y; // 블럭 위치
var score = 0; // 점수
var level = 0; // 레벨 (0->1레벨)
// 추가된 변수 (레벨업에 관련된 변수)
var totalEraseLine = 0; // 총 삭제행 수
var chkLevelUp = 0; // 레벨업을 체크변수(최종 레벨의 삭제행 수를 저장)
var stepLevelLine = 10 // 레벨업이 몇 삭제행 단위로 동작하는지 (5이상으로 설정)
var blockTotal; // 떨어진 블럭 총 갯수
var lx = 25; ly = 25; // 블럭 위치 조정값
var shapeNo = 0;
var rix = 0;
var shape;
var shapeColor;
var nextShape;
var timeoutID;
var area = new Array(cx*cy);
function startTetris() {
if(document.all.btnStart.value == '포기!') {
if(confirm("게임을 포기하겠습니까 ?")) {
clearTimeout(timeoutID);
alert("게임 끝 ~~~ 점수 : " + score + " / 삭제행 : " + totalEraseLine);
location = "?d=" + escape(new Date());
return;
} else {
return;
}
}
document.all.btnStart.value = "포기!";
clearTimeout(timeoutID);
level = 0;
blockTotal = 0;
// showLevel(); 처음에는 레별표시를 지움
nextShape = Math.floor(Math.random()*matrix.length);
score = 0;
document.all.txtScore.value = 0;
for(var i=0; i<area.length; i++) {
area[i] = 0;
document.all.bg[i].style.backgroundColor = background;
}
down();
}
function showLevel() {
document.all.blockSpan.style.visibility = "hidden";
alert("LEVEL " + (level + 1));
document.all.blockSpan.style.visibility="visible";
}
function doMove(n) {
if(!canMove(x+n, y, shape)) { return; }
x += n;
moveTetris(x, y, 0);
}
function fixBlock(x, y, shp) {
var lineElasped = 0;
for(var i=0; i<shp.length; i++) {
var c = 8;
var ni = shp[i];
if(ni > 0) {
for(var j=0; j<4; j++) {
if((ni&c) > 0) {
var dx = x + j;
var dy = y + i;
var pno = dy * cx + dx;
area[pno] = shapeNo + 1;
document.all.bg[pno].style.backgroundColor = colors
[shapeNo];
}
c >>= 1;
}
}
}
var redraw = -1;
for(var i=0; i<cy; i++) {
var pno = i * cx;
for(var j=0; j<cx; j++) {
if(area[pno++] == 0) { break; }
}
if(j == cx) {
lineElasped++;
totalEraseLine++;
for(var k=i; k>0; k--) {
var pd = k*cx; var ps = (k-1)*cx;
for(var j=0; j<cx; j++) {
area[pd] = area[ps];
pd++; ps++;
}
}
redraw = i;
}
}
if(redraw >= 0) {
for(var i=0; i<(redraw+1)*cx; i++) {
document.all.bg[i].style.backgroundColor=area[i]==0 ? background : colors
[area[i]-1];
}
}
score += scoreRule[lineElasped];
document.all.txtScore.value = score;
blockTotal++;
// 레벨업 방법을 블럭갯수에서 삭제행 수로 계산방법을 변경
if((totalEraseLine - chkLevelUp - stepLevelLine >= 0) && (level < 9)) {
level++;
chkLevelUp += stepLevelLine
showLevel();
}
}
function canMove( x, y, shp ) {
for(var i=0; i<shp.length; i++) {
var c = 8;
var ni = shp[i];
if(ni > 0) {
for(var j=0;j<4;j++) {
if((ni&c) > 0) {
var dx = x+j;
var dy = y+i;
if(dx<0 || dx>=cx || dy<0 || dy>=cy) { return false; }
if(area[cx*dy+dx] > 0) { return false; }
}
c >>= 1;
}
}
}
return true;
}
function rotate() {
var l = matrix[shapeNo].length;
nrix = (rix + 1) % l;
if(!canMove(x, y, matrix[shapeNo][nrix])) { return; }
shape = matrix[shapeNo][nrix];
shapeColor = colors[shapeNo];
rix = nrix;
makeShape();
}
function checkKey() {
var c = String.fromCharCode(event.keyCode);
if(c=='j' || c=='J') { doMove(-1); }
if(c=='l' || c=='L') { doMove(+1); }
if(c=='i' || c=='I') { rotate(); }
if(c=='k' || c=='K') {
clearTimeout(timeoutID);
while(canMove(x, y+1, shape)) { y++; }
downFunc();
}
}
var yc = 0;
function moveTetris(x, y, yc) {
document.all.blockSpan.style.pixelTop = y * 20 + ly;
document.all.blockSpan.style.pixelLeft = x * 20 + lx;
}
function downFunc() {
if(!canMove(x, y+1, shape)) {
fixBlock(x, y, shape);
down();
return;
}
moveTetris(x, ++y, yc);
timeoutID = setTimeout(downFunc,speed[level]);
}
function down() {
shapeNo = nextShape;
nextShape = Math.floor(Math.random() * matrix.length);
shape = matrix[nextShape][0];
shapeColor = colors[nextShape];
makeShapePreview();
shape = matrix[shapeNo][0];
shapeColor = colors[shapeNo];
makeShape();
document.all.blockSpan.style.visibility = "visible";
document.all.blockPreview.style.visibility = "visible";
rix = 0;
y = -1; x = 5; yc = 0;
if(!canMove(x, y+1, shape)) {
// alert("게임 끝 ~~~ 당신의 점수는 " + score + "점이며 총 " + totalEraseLine + "입니다.\n등수는 랭킹페이지에서 확인 할 수 있습니다.");
alert("게임 끝 ~~~ 점수 : " + score + " / 삭제행 : " + totalEraseLine);
clearTimeout(timeoutID);
// location = "rank.asp?game=tetris&score=" + score;
location = "?d=" + escape(new Date());
return;
}
downFunc();
}
// 블럭에서 빠진 2개의 블럭 배열을 추가
var matrix = new Array (
new Array (
// 0000
// 0110
// 0110
// 0000
new Array( 0x0, 0x6, 0x6, 0x0 )
),
new Array ( // 추가된 블럭
// 0000 1000
// 0110 1100
// 1100 0100
// 0000 0000
new Array( 0x0, 0x6, 0xc, 0x0 ),
new Array( 0x8, 0xc, 0x4, 0x0 )
),
new Array ( // 추가된 블럭
// 0000 0100
// 1100 1100
// 0110 1000
// 0000 0000
new Array( 0x0, 0xc, 0x6, 0x0 ),
new Array( 0x4, 0xc, 0x8, 0x0 )
),
new Array (
// 0000 0100 0010 1100
// 1110 0100 1110 0100
// 1000 0110 0000 0100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x8, 0x0 ),
new Array( 0x4, 0x4, 0x6, 0x0 ),
new Array( 0x2, 0xe, 0x0, 0x0 ),
new Array( 0xc, 0x4, 0x4, 0x0 )
),
new Array (
// 0000 0110 1000 0100
// 1110 0100 1110 0100
// 0010 0100 0000 1100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x2, 0x0 ),
new Array( 0x6, 0x4, 0x4, 0x0 ),
new Array( 0x8, 0xe, 0x0, 0x0 ),
new Array( 0x4, 0x4, 0xc, 0x0 )
),
new Array (
// 0000 0100 0100 0100
// 1110 0110 1110 1100
// 0100 0100 0000 0100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x4, 0x0 ),
new Array( 0x4, 0x6, 0x4, 0x0 ),
new Array( 0x4, 0xe, 0x0, 0x0 ),
new Array( 0x4, 0xc, 0x4, 0x0 )
),
new Array (
// 0000 0100
// 1111 0100
// 0000 0100
// 0000 0100
new Array( 0x0, 0xf, 0x0, 0x0 ),
new Array( 0x4, 0x4, 0x4, 0x4 )
)
);
function makeShapePreview() {
makeShapeB(document.all.pblock);
}
function makeShape() {
makeShapeB(document.all.block);
}
function makeShapeB( blocks ) {
var sh = shape;
var co = 0;
var col = shapeColor;
for(var i=0; i<4; i++) {
var ix = 8;
for(var j=0; j<4; j++) {
if((ix&sh[i]) > 0) {
blocks[co].style.backgroundColor = col;
blocks[co].style.borderColor = col;
blocks[co].style.pixelLeft = j * 20;
blocks[co].style.pixelTop = i * 20;
co++;
}
ix >>= 1;
}
}
}
</script>
</head>
<body onkeyPress="checkKey();" leftmargin="20" topmargin="20" bgcolor="#333333">
<table cellpadding="0" cellspacing="5" bgcolor="#666666" border="0">
<tr>
<td>
<table border="0" cellpadding="0" bgcolor="#333333" cellspacing="1">
<script language='javascript'>
for(var i=0; i<cy; i++) {
document.write("<tr height='19'>");
for(var j=0;j<cx;j++) {
document.write("<td width='19' id='bg' bgcolor='" + background + "'> </td>");
}
document.write("</tr>");
}
</script>
</table>
</td>
<td valign="top" bgcolor="gray" align="center">
<br>
<span style="font-weight: bold; color: #CCCCCC; height: 41; vertical-align:
center;">TETRIS</span>
<br>
<table border="0" cellpadding="0" bgcolor="#333333" cellspacing="1">
<script language='javascript'>
for(var i=0; i<4; i++) {
document.write("<tr height='19'>");
for(var j=0; j<4; j++) {
document.write("<td width='19' bgcolor='" + background + "'> </td>");
}
document.write("</tr>");
}
</script>
</table>
<br>
SCORE:<br>
<input type="text" id="txtScore" style="border: 1px solid black; font-weight: bold; font-
family: verdana; font-size: 11pt; width: 100%; text-align: right; background-color: black; color: #FFFFFF;"><br>
<input type="button" id="btnStart" value="시작!" onfocus="blur()" onclick="startTetris()"
style="width:100%">
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="4" style="font-size: 10pt;
font-weight: bold;">
<tr align="center">
<td>J</td>
<td>:</td>
<td align="left">왼쪽</td>
</tr>
<tr align="center">
<td>L</td>
<td>:</td>
<td align="left">오른쪽</td>
</tr>
<tr align="center">
<td>K</td>
<td>:</td>
<td align="left">아래</td>
</tr>
<tr align="center">
<td>I</td>
<td>:</td>
<td align="left">회전</td>
</tr>
</table>
<br>
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="4" style="font-size: 10pt;
color: #ffffff;">
<tr align="center">
<td>글자크기는</td>
</tr>
<tr align="center">
<td>보통으로..</td>
</tr>
</table>
<br>
<br>
<br>
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size: 9pt;
color: #cccccc;">
<tr align="center">
<td>제작자:김연진</td>
</tr>
<tr align="center">
<td> </td>
</tr>
<tr align="center">
<td>수정자:강현석</td>
</tr>
</table>
</td>
</tr>
</table>
<span style="position: absolute; visibility: hidden;" id="blockSpan">
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
</span>
<span style="position:absolute;left:271;top:85;visibility:hidden" id="blockPreview">
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
</span>
</html>
<!--
파일명 : TETRIS.html (JavaScript를 이용한 테트리스 게임)
제작자 : 김연진
제작일 : 2004. 6. 23 Taeyo.Net 사이트에 올라온 소스
수정자 : 강현석
수정일 : 2004. 6. 29.
수정내용 : 본소스에서 테트리스 블럭중 빠진 블럭 2가지(┌┘,└┐)를 추가하고,
몇가지 변수들과 레벨업을 제 나름대로 수정했으며 태그도 조금 손을 보았습니다.
-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr">
<script language='javascript'>
var cx = 12; // x 축 크기
var cy = 28; // y 축 크기
var background = "black"; // 백그라운드 색
// 점수를 동시 삭제행이 많을수록 점수가 기하급수적으로 늘어나도록 조정
var scoreRule = new Array(1, 10, 40, 90, 160); // 점수 규칙 ( 행삭제갯수가 0 이면 1, 1이면 10, ... )
// 본인이 너무 빠른 속도에 적응을 못하기 때문에 조금 속도를 늦추면서 단계간의 격차를 일률적으로 조정
var speed = new Array(1000, 700, 490, 343, 240, 168, 117, 82, 57, 40); // 레벨에 따른 속도 ( 레벨1 : 1 초에 1칸, 레벨2 : 0.7초에 한칸 ... )
// 블럭을 모양에 따라 서로 비슷한 색을 띄도록 수정하고 추가된 블럭에 맞게 2가지 색상을 추가
var colors = new Array("#999999", "#3399ff", "#9933ff", "#33ff99", "#99ff33", "#ff9933", "#ff3399"); // 블럭별 색
var x, y; // 블럭 위치
var score = 0; // 점수
var level = 0; // 레벨 (0->1레벨)
// 추가된 변수 (레벨업에 관련된 변수)
var totalEraseLine = 0; // 총 삭제행 수
var chkLevelUp = 0; // 레벨업을 체크변수(최종 레벨의 삭제행 수를 저장)
var stepLevelLine = 10 // 레벨업이 몇 삭제행 단위로 동작하는지 (5이상으로 설정)
var blockTotal; // 떨어진 블럭 총 갯수
var lx = 25; ly = 25; // 블럭 위치 조정값
var shapeNo = 0;
var rix = 0;
var shape;
var shapeColor;
var nextShape;
var timeoutID;
var area = new Array(cx*cy);
function startTetris() {
if(document.all.btnStart.value == '포기!') {
if(confirm("게임을 포기하겠습니까 ?")) {
clearTimeout(timeoutID);
alert("게임 끝 ~~~ 점수 : " + score + " / 삭제행 : " + totalEraseLine);
location = "?d=" + escape(new Date());
return;
} else {
return;
}
}
document.all.btnStart.value = "포기!";
clearTimeout(timeoutID);
level = 0;
blockTotal = 0;
// showLevel(); 처음에는 레별표시를 지움
nextShape = Math.floor(Math.random()*matrix.length);
score = 0;
document.all.txtScore.value = 0;
for(var i=0; i<area.length; i++) {
area[i] = 0;
document.all.bg[i].style.backgroundColor = background;
}
down();
}
function showLevel() {
document.all.blockSpan.style.visibility = "hidden";
alert("LEVEL " + (level + 1));
document.all.blockSpan.style.visibility="visible";
}
function doMove(n) {
if(!canMove(x+n, y, shape)) { return; }
x += n;
moveTetris(x, y, 0);
}
function fixBlock(x, y, shp) {
var lineElasped = 0;
for(var i=0; i<shp.length; i++) {
var c = 8;
var ni = shp[i];
if(ni > 0) {
for(var j=0; j<4; j++) {
if((ni&c) > 0) {
var dx = x + j;
var dy = y + i;
var pno = dy * cx + dx;
area[pno] = shapeNo + 1;
document.all.bg[pno].style.backgroundColor = colors
[shapeNo];
}
c >>= 1;
}
}
}
var redraw = -1;
for(var i=0; i<cy; i++) {
var pno = i * cx;
for(var j=0; j<cx; j++) {
if(area[pno++] == 0) { break; }
}
if(j == cx) {
lineElasped++;
totalEraseLine++;
for(var k=i; k>0; k--) {
var pd = k*cx; var ps = (k-1)*cx;
for(var j=0; j<cx; j++) {
area[pd] = area[ps];
pd++; ps++;
}
}
redraw = i;
}
}
if(redraw >= 0) {
for(var i=0; i<(redraw+1)*cx; i++) {
document.all.bg[i].style.backgroundColor=area[i]==0 ? background : colors
[area[i]-1];
}
}
score += scoreRule[lineElasped];
document.all.txtScore.value = score;
blockTotal++;
// 레벨업 방법을 블럭갯수에서 삭제행 수로 계산방법을 변경
if((totalEraseLine - chkLevelUp - stepLevelLine >= 0) && (level < 9)) {
level++;
chkLevelUp += stepLevelLine
showLevel();
}
}
function canMove( x, y, shp ) {
for(var i=0; i<shp.length; i++) {
var c = 8;
var ni = shp[i];
if(ni > 0) {
for(var j=0;j<4;j++) {
if((ni&c) > 0) {
var dx = x+j;
var dy = y+i;
if(dx<0 || dx>=cx || dy<0 || dy>=cy) { return false; }
if(area[cx*dy+dx] > 0) { return false; }
}
c >>= 1;
}
}
}
return true;
}
function rotate() {
var l = matrix[shapeNo].length;
nrix = (rix + 1) % l;
if(!canMove(x, y, matrix[shapeNo][nrix])) { return; }
shape = matrix[shapeNo][nrix];
shapeColor = colors[shapeNo];
rix = nrix;
makeShape();
}
function checkKey() {
var c = String.fromCharCode(event.keyCode);
if(c=='j' || c=='J') { doMove(-1); }
if(c=='l' || c=='L') { doMove(+1); }
if(c=='i' || c=='I') { rotate(); }
if(c=='k' || c=='K') {
clearTimeout(timeoutID);
while(canMove(x, y+1, shape)) { y++; }
downFunc();
}
}
var yc = 0;
function moveTetris(x, y, yc) {
document.all.blockSpan.style.pixelTop = y * 20 + ly;
document.all.blockSpan.style.pixelLeft = x * 20 + lx;
}
function downFunc() {
if(!canMove(x, y+1, shape)) {
fixBlock(x, y, shape);
down();
return;
}
moveTetris(x, ++y, yc);
timeoutID = setTimeout(downFunc,speed[level]);
}
function down() {
shapeNo = nextShape;
nextShape = Math.floor(Math.random() * matrix.length);
shape = matrix[nextShape][0];
shapeColor = colors[nextShape];
makeShapePreview();
shape = matrix[shapeNo][0];
shapeColor = colors[shapeNo];
makeShape();
document.all.blockSpan.style.visibility = "visible";
document.all.blockPreview.style.visibility = "visible";
rix = 0;
y = -1; x = 5; yc = 0;
if(!canMove(x, y+1, shape)) {
// alert("게임 끝 ~~~ 당신의 점수는 " + score + "점이며 총 " + totalEraseLine + "입니다.\n등수는 랭킹페이지에서 확인 할 수 있습니다.");
alert("게임 끝 ~~~ 점수 : " + score + " / 삭제행 : " + totalEraseLine);
clearTimeout(timeoutID);
// location = "rank.asp?game=tetris&score=" + score;
location = "?d=" + escape(new Date());
return;
}
downFunc();
}
// 블럭에서 빠진 2개의 블럭 배열을 추가
var matrix = new Array (
new Array (
// 0000
// 0110
// 0110
// 0000
new Array( 0x0, 0x6, 0x6, 0x0 )
),
new Array ( // 추가된 블럭
// 0000 1000
// 0110 1100
// 1100 0100
// 0000 0000
new Array( 0x0, 0x6, 0xc, 0x0 ),
new Array( 0x8, 0xc, 0x4, 0x0 )
),
new Array ( // 추가된 블럭
// 0000 0100
// 1100 1100
// 0110 1000
// 0000 0000
new Array( 0x0, 0xc, 0x6, 0x0 ),
new Array( 0x4, 0xc, 0x8, 0x0 )
),
new Array (
// 0000 0100 0010 1100
// 1110 0100 1110 0100
// 1000 0110 0000 0100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x8, 0x0 ),
new Array( 0x4, 0x4, 0x6, 0x0 ),
new Array( 0x2, 0xe, 0x0, 0x0 ),
new Array( 0xc, 0x4, 0x4, 0x0 )
),
new Array (
// 0000 0110 1000 0100
// 1110 0100 1110 0100
// 0010 0100 0000 1100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x2, 0x0 ),
new Array( 0x6, 0x4, 0x4, 0x0 ),
new Array( 0x8, 0xe, 0x0, 0x0 ),
new Array( 0x4, 0x4, 0xc, 0x0 )
),
new Array (
// 0000 0100 0100 0100
// 1110 0110 1110 1100
// 0100 0100 0000 0100
// 0000 0000 0000 0000
new Array( 0x0, 0xe, 0x4, 0x0 ),
new Array( 0x4, 0x6, 0x4, 0x0 ),
new Array( 0x4, 0xe, 0x0, 0x0 ),
new Array( 0x4, 0xc, 0x4, 0x0 )
),
new Array (
// 0000 0100
// 1111 0100
// 0000 0100
// 0000 0100
new Array( 0x0, 0xf, 0x0, 0x0 ),
new Array( 0x4, 0x4, 0x4, 0x4 )
)
);
function makeShapePreview() {
makeShapeB(document.all.pblock);
}
function makeShape() {
makeShapeB(document.all.block);
}
function makeShapeB( blocks ) {
var sh = shape;
var co = 0;
var col = shapeColor;
for(var i=0; i<4; i++) {
var ix = 8;
for(var j=0; j<4; j++) {
if((ix&sh[i]) > 0) {
blocks[co].style.backgroundColor = col;
blocks[co].style.borderColor = col;
blocks[co].style.pixelLeft = j * 20;
blocks[co].style.pixelTop = i * 20;
co++;
}
ix >>= 1;
}
}
}
</script>
</head>
<body onkeyPress="checkKey();" leftmargin="20" topmargin="20" bgcolor="#333333">
<table cellpadding="0" cellspacing="5" bgcolor="#666666" border="0">
<tr>
<td>
<table border="0" cellpadding="0" bgcolor="#333333" cellspacing="1">
<script language='javascript'>
for(var i=0; i<cy; i++) {
document.write("<tr height='19'>");
for(var j=0;j<cx;j++) {
document.write("<td width='19' id='bg' bgcolor='" + background + "'> </td>");
}
document.write("</tr>");
}
</script>
</table>
</td>
<td valign="top" bgcolor="gray" align="center">
<br>
<span style="font-weight: bold; color: #CCCCCC; height: 41; vertical-align:
center;">TETRIS</span>
<br>
<table border="0" cellpadding="0" bgcolor="#333333" cellspacing="1">
<script language='javascript'>
for(var i=0; i<4; i++) {
document.write("<tr height='19'>");
for(var j=0; j<4; j++) {
document.write("<td width='19' bgcolor='" + background + "'> </td>");
}
document.write("</tr>");
}
</script>
</table>
<br>
SCORE:<br>
<input type="text" id="txtScore" style="border: 1px solid black; font-weight: bold; font-
family: verdana; font-size: 11pt; width: 100%; text-align: right; background-color: black; color: #FFFFFF;"><br>
<input type="button" id="btnStart" value="시작!" onfocus="blur()" onclick="startTetris()"
style="width:100%">
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="4" style="font-size: 10pt;
font-weight: bold;">
<tr align="center">
<td>J</td>
<td>:</td>
<td align="left">왼쪽</td>
</tr>
<tr align="center">
<td>L</td>
<td>:</td>
<td align="left">오른쪽</td>
</tr>
<tr align="center">
<td>K</td>
<td>:</td>
<td align="left">아래</td>
</tr>
<tr align="center">
<td>I</td>
<td>:</td>
<td align="left">회전</td>
</tr>
</table>
<br>
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="4" style="font-size: 10pt;
color: #ffffff;">
<tr align="center">
<td>글자크기는</td>
</tr>
<tr align="center">
<td>보통으로..</td>
</tr>
</table>
<br>
<br>
<br>
<br>
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size: 9pt;
color: #cccccc;">
<tr align="center">
<td>제작자:김연진</td>
</tr>
<tr align="center">
<td> </td>
</tr>
<tr align="center">
<td>수정자:강현석</td>
</tr>
</table>
</td>
</tr>
</table>
<span style="position: absolute; visibility: hidden;" id="blockSpan">
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="block"></span>
</span>
<span style="position:absolute;left:271;top:85;visibility:hidden" id="blockPreview">
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
<span style="width: 20; height: 20; border: 1px solid #CCCCCC; position: absolute;"
id="pblock"></span>
</span>
</html>
'인터넷관련' 카테고리의 다른 글
| 날마다 바귀는 속담 - 매일 랜덤 (0) | 2008.02.02 |
|---|---|
| 팝업창 소스 제작기 (0) | 2008.02.02 |
| 레이어를 이용한 팝업 메뉴 (0) | 2008.02.02 |
| 엔터(Enter)키가 탭(Tab)키 처럼 동작하게 하기 (0) | 2008.02.02 |
| 메뉴 자동 생성기 (DHTML) (0) | 2008.02.02 |
| 공백만으로 구성된 문자열 체크 (0) | 2008.02.02 |
| 간단하게 글자수 제한하기 (0) | 2008.02.02 |
| 이미지 실시간 보여주기, 용량체크, 스타일동적교체 (0) | 2008.02.02 |
invalid-file
