This article mainly introduces the implementation of JS Tetris game sharing, need friends can refer to the following
The code is as follows: <!doctype html><html><head><style type= "Text/css" > body {background: #000; font:25px/ 25px song Body;} #box {float:left;width:252px;border: #999 20px ridge;color: #9f9; text-shadow:2px 3px 1px #0f0;} #info {float:left;color: #cfc;p adding:24px; } #next {padding:8px;width:105px;color: #9f9; text-shadow:2px 3px 1px #0f0; </style></head><body> <div id= "box" ></div><div id= "info" >next:<div id= "NEXT" ></div><div "text" > </div></div> <script type= "Text/javascript" > var map=eval ("[" +array (). Join ("0x801,") + "0XFFF]") ; var tatris=[[0x6600],[0x2222,0xf00],[0xc600,0x2640],[0x6c00,0x4620],[0x4460,0x2e0,0x6220,0x740],[0x2260,0xe20, 0X6440,0X4700],[0X2620,0X720,0X2320,0X2700]]; var char={x: "u3000", S: "U25a0", T: "U25A1"}; var keycom={"": "Rotate (1)", "the": "Down ()", "Panax Notoginseng": "Move (2,1)", "": "Move (0.5,-1)", "a": "0;pause=!pause"}; var dia, POS, bak, run, Next, Pause=false, info={speed:1,lines:0,score:0}; function staRT () { DIA=NEXT.D BAK=POS={FK:[],Y:0,X:4,S:NEXT.S}; Nextdia (); doc Ument.getelementbyid ("Next"). Innerhtml= (next.d[next.s%next.d.length]|0x10000). toString (2). Slice ( -16). Replace (/ .../g, "$&<br/>"). Replace (/1/G,CHAR.T). replace (/0/g,char.x); document.getElementById ("text"). Innerhtml= "SCORE:" +info.score+ "<br/><br/>lines:" + info.lines+ "<br/><br/>speed:" +info.speed; Rotate (0); Run=setinterval ("pause| | Down () ", ~ ~ (Math.pow (1.3,12-info.speed) *30+20)); function over () { document.onkeydown=null alert ("GAME over");} function Nextdia () { & nbsp Next={d:tatris[~~ (Math.random () *7)],s:~~ (Math.random () *4)}; function Update (t) { bak={fk:pos.fk.slice (0), Y:POS.Y,X:POS.X,S:POS.S}; if (t) return; for (Var i=0,a2= ""; i<22; i++) a2+=map[i].tostring (2) Slice (1,-1) + "<br/>"; for (var i=0,n i<4; i++) if (/([^0]+)/.test (bak.fk[i].tostring (2). Replace (/1 /G,CHAR.T)) A2=A2.SUBSTR (0,n= (bak.y+i+1) *15-regexp.$_.length-4) +regexp.$1+ A2.slice (n+regexp.$1.length); document.getElementById ("box"). Innerhtml=a2.replace (/1/G,CHAR.S). replace (/0/g,char.x); The function is () { for (var i=0 i<4; i++) if ((pos.fk[i]&map[pos.y+i)!=0) r Eturn Pos=bak; function Rotate (r) { var f=dia[pos.s= (pos.s+r)%dia.length]; for (var i=0; i<4; i++) pos.fk[i]= (f>> (12-i*4) &15) <<pos.x; Update (IS ()); function down () { ++POS.Y if (was) { for (Var i=0, r=0; i<4 &am p;& pos.y+i<22; i++) if ((Map[pos.y+i]|=pos.fk[i]) ==0xfff) { &N Bsp Map.splice (pos.y+i,1), Map.unshift (0x801); ++info.lines%20==0 && info.speed++, r++; clearinterval (run); if (map[1]!=0x801) return over (); info.score+=~~ (Math.pow (r,1.5) *10) +2; start (); } update (); function Move (t,k) { pos.x+=k for (var i=0 i<4; i++) Pos.fk[i ]*=t; Update (IS ()); } document.onkeydown=function (e) { eval ("pause| |") +keycom[(e?e:event). KeyCode]); }; Nextdia (); Start (); </script></body></html> Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
