From: http://topic.csdn.net/u/20100618/09/B16693A6-77D1-4E53-B1D5-BC8BB90CCED5.html
<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <br/> <HTML xmlns = "http://www.w3.org/1999/xhtml"> <br/> <pead> <br/> <meta http-equiv = "Content-Type" content = "text/html; charset = UTF-8 "/> <br/> <title> snake </title> <br/> <script language =" JavaScript "type =" text/JavaScript "src = ".. /scripts/jquery-1 [1]. 2.6.js "mce_src =" scripts/jquery-1 [1 ]. 2.6.js "> </SCRIPT> <br/> <script language =" JavaScript "type =" text/JavaScript "> <! -- <Br/> $ (function () {<br/> $ ("body "). append ("<Div id = 'panel '> </div>"); </P> <p> // create a map <br/> var strhtml = ""; <br/> for (I = 0; I <long; I ++) <br/> {<br/> for (j = 0; j <pigh; j ++) <br/> {<br/> strhtml + = '<span xindex = "' + J + '" yindex = "' + I + '" class = "map nosnake"> </span> '; <br/>}< br/> strhtml + = '<Div class = "clear"> </div> '; <br/>}< br/> $ ("# panel "). append (strhtml); </P> <p> // keyboard click event <br/> $ (document ). keyd Own (function (EVT) {<br/> EVT = EVT | window. event; <br/> var key = EVT. which | EVT. keycode; <br/> switch (key) <br/>{< br/> case 37: Direction = "Left"; break; <br/> case 38: direction = "up"; break; <br/> case 39: Direction = "right"; break; <br/> case 40: Direction = "down"; break; <br/>}< br/>}); </P> <p> Init (); </P> <p> }); </P> <p> var long = 10; <br/> var high = 10; <br/> var slong = 3; <br/> var direction = 'righ T'; <br/> var myinterval = NULL; <br/> var timespan = 1000; </P> <p> // initialization <br/> function Init () <br/>{< br/> long = 10; <br/> high = 10; <br/> slong = 3; <br/> direction = 'right '; </P> <p> for (I = 0; I <slong; I ++) <br/> {<br/> $ ("span [yindex = '0'] [xindex = '" + (sLong-i-1) + "']"). ATTR ("Index", I ). removeclass ("nosnake "). addclass ("snake"); <br/>}< br/> disfood (); <br/> myinterval = setinterval ("movenext ()", Timespan); <br/>}< br/> // move to the next <br/> function movenext () <br/>{< br/> hspan = $ ("span [Index = '0']"); <br/> x = 0; <br/> Y = 0; <br/> If (Direction = 'left') <br/>{< br/> X =-1; <br/> Y = 0; <br/>} else if (Direction = 'right') <br/>{< br/> x = 1; <br/> Y = 0; <br/>} else if (Direction = 'up') <br/>{< br/> x = 0; <br/> Y =-1; <br/>} else if (Direction = 'drop') <br/>{< br/> x = 0; <br/> Y = 1; <br />}</P> <p> HX = parseint (hspan. ATTR ('xindex'); <br/> HY = parseint (hspan. ATTR ('yindex'); <br/> Nx = HX + X; <br/> ny = hy + Y; <br/> If (nx <0 | NX> = long | ny <0 | ny> = high) <br/>{< br/> failure (); <br/>} else if ($ (". snake [xindex = '"+ NX +"'] [yindex = '"+ ny +"'] "). size ()> 0) <br/>{< br/> failure (); <br/>}</P> <p >$ (". snake "). ATTR ("Temp", "Temp"); <br/> nextmove (0, NX, NY); <br/> if ($ (". food "). Size () = 0) <br/>{< br/> disfood (); <br/> $ ("span [temp = 'temp ']"). ATTR ("Index", slong ). removeattr ("Temp "). removeclass ("nosnake "). addclass ("snake"); <br/> timespan = timeSpan-10; <br/> slong ++; <br/>}< br/> $ ("span [temp = 'temp ']"). removeclass ("snake "). removeclass ("food "). addclass ("nosnake "). removeattr ("Index "). removeattr ("Temp"); <br/>}< br/> // display food <br/> function disfood () <br/>{</P> <p> nosnkecount = Parseint ($ (". nosnake "). size (); <br/> If (nosnail kecount> 1) <br/>{< br/> foodindex = math. round (math. random () * nosnkecount); <br/> $ (". nosnake "). eq (foodindex ). removeclass ("nosnake "). addclass ("food"); <br/>}else <br/>{< br/> success (); <br/>}< br/> // move the next section of the snake body <br/> function nextmove (index, x, y) <br/> {<br/> If (index <slong & $ ("span [Index = '" + index + "'] [temp = 'temp ']"). size ()> 0) <br/> {<Br/> Tx = $ ("span [Index = '" + index + "'] [temp = 'temp ']"). ATTR ("xindex"); <br/> ty = $ ("span [Index = '" + index + "'] [temp = 'temp ']"). ATTR ("yindex "); </P> <p> $ ("span [xindex = '" + x + "'] [yindex = '" + Y + "']"). ATTR ("Index", index ). removeattr ("Temp "). removeclass ("nosnake "). removeclass ("food "). addclass ("snake"); <br/> nextmove (++ index, TX, Ty ); <br/>}</P> <p> function success () <br/>{< br/> alert ("You have won"); <br/>}</P> <p> function failure () <br/>{< br/> clearinterval (myinterval ); <br/> alert ('terminated '); <br/>}< br/> // --> </SCRIPT> </P> <p> <style type = "text/CSS"> <! -- <Br/>. map {<br/> width: 10px; <br/> Height: 10px; <br/> border: 1px solid #000; <br/> float: left; <br/>}< br/>. nosnake {<br/> Background: # 00f; <br/>}< br/>. snake {<br/> Background: # f00; <br/>}< br/>. food {<br/> Background: # ff0; <br/>}< br/>. clear {<br/> clear: both; <br/>}< br/> --> </style> <style type = "text/CSS" mce_bogus = "1">. map {<br/> width: 10px; <br/> Height: 10px; <br/> border: 1px solid #000; <br/> float: left; <br/>}< br/>. nosnake {<br/> Background: # 00f; <br/>}< br/>. snake {<br/> Background: # f00; <br/>}< br/>. food {<br/> Background: # ff0; <br/>}< br/>. clear {<br/> clear: both; <br/>}</style> </P> <p> </pead> </P> <p> <body> <br/> </body> <br /> </ptml>
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
