html 代码
- <!DOCTYPE HTML>
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
- <title > 无标题文档 </title>
- <style>
- *{ padding:0; margin:0; text-align:center;}
- #myt{ border:1px solid #000; text-align:center; }
- table{ text-align:center; margin:0 auto;}
- td{ width:25px; height:25px; border:1px solid #000;}
- .col{animation:mydd 1s;}
- .color{
- background: #000;}
- .grade{ background:#00ff00;}
- .ann{ width:15%; height:150px; margin:5%; font-size:50px; }
- </style>
- <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
- <script type="text/javascript">
- var height = 20 ; // 行
- var width = 30 ; // 列
- var list = 1; // 移动行
- var row = 1; // 移动列
- var fangxiang = 2; // 方向
- var speed; // 速度
- var tailspeed; // 尾巴时间
- var lenghts = 1; // 蛇的长度
- var rlist; // 随机分数行
- var rrow; // 随机分数列
- var fs = 0;
- var wu; // 不是蛇的块
- var td = "<td></td>"
- var tr = "<tr></tr>"
- // 画图
- $(document).ready(function(){
- for(var i= 0;i<width;i++){
- td = td + "<td></td>"
- }
- for(var i= 0;i<height;i++){
- tr = tr + "<tr></tr>"
- }
- $("#myt").html(tr);
- $("#myt tr").each(function(index){
- $(this).html(td);
- })
- start();
- $(".ann").eq(0).click(function(aa){
- fangxiang = 1;
- })
- $(".ann").eq(1).click(function(aa){
- fangxiang = 4;
- })
- $(".ann").eq(2).click(function(aa){
- fangxiang = 3;
- })
- $(".ann").eq(3).click(function(aa){
- fangxiang = 2;
- })
- })
- // 开始
- function start(){
- mysnake = setInterval("xingzou()",250);
- rlist = Math.floor(Math.random()*19+1);
- rrow = Math.floor(Math.random()*29+1);
- $("#myt tr").eq(rlist).find("td").eq(rrow).attr("alt","2");
- }
- // 控制
- $(document).keydown(function(event){
- if(event.keyCode == 38){
- fangxiang = 1;
- }
- if(event.keyCode == 39){
- fangxiang = 2;
- }
- if(event.keyCode == 40){
- fangxiang = 3;
- }
- if(event.keyCode == 37){
- fangxiang = 4;
- }
- })
- // 行走
- function xingzou(){
- switch(fangxiang)
- {
- case 1:
- shang();
- break;
- case 2:
- you();
- break;
- case 3:
- xia();
- break;
- case 4:
- zuo();
- break;
- default:
- }
- //add();
- snake();
- grade();
- setTimeout("cle()",speed);
- }
- // 方向
- function shang(){
- list--;
- }
- function you(){
- row++;
- }
- function xia(){
- list++;
- }
- function zuo(){
- row--;
- }
- var arr = new Array();
- // 画蛇
- function snake(){
- $("#myt tr").each(function(index){
- if(index == list){
- if($(this).find("td").eq(row).attr("class")=="color"){
- if(confirm("自己怼死了! 是否续命 +1s")){
- $("#myt tr").find("td").each(function(){
- if($(this).attr("class")=="color"){
- $(this).removeClass("color","color").attr("alt","");
- }
- })
- list = 2;
- row = 2;
- fangxiang = 2;
- }
- if(!confirm("自己怼死了! 是否续命 +1s")){
- window.top.location.reload();
- }
- }
- if($(this).find("td").eq(row).attr("alt")=="2"){
- lenghts = lenghts + 1;
- fs = fs + 1;
- $("#ff").html(parseInt(fs))
- rep();
- }
- $(this).find("td").eq(row).attr("alt","1").addClass("color");
- arr.push($(this).find("td").eq(row));
- }
- })
- speed = lenghts / 0.004;
- }
- // 清除尾巴
- function cle(){
- if(arr!=null&&arr.length>0){
- var obj = arr.shift();
- obj.removeClass("color","grade").attr("alt","");
- }
- }
- // 分数
- function grade(){
- $("#myt tr").find("td").each(function(){
- if($(this).attr("alt")=="2"){
- $(this).addClass("grade")
- }else{
- $(this).removeClass("grade")
- }
- })
- if(list>= 21 || list <0){
- if(confirm("自己怼死了! 是否续命 +1s")){
- $("#myt tr").find("td").each(function(){
- if($(this).attr("class")=="color"){
- $(this).removeClass("color","color").attr("alt","");
- }
- })
- list = 2;
- row = 2;
- fangxiang = 2;
- }
- if(!confirm("自己怼死了! 是否续命 +1s")){
- window.top.location.reload();
- }
- }
- if(row>= 31 || row <0){
- if(confirm("自己怼死了! 是否续命 +1s")){
- $("#myt tr").find("td").each(function(){
- if($(this).attr("class")=="color"){
- $(this).removeClass("color","color").attr("alt","");
- }
- })
- list = 2;
- row = 2;
- fangxiang = 2;
- }
- if(!confirm("自己怼死了! 是否续命 +1s")){
- window.top.location.reload();
- }
- }
- }
- // 重复刷新
- function rep(){
- wu = Math.floor(Math.random()*parseInt(651 - lenghts)+1);
- $("td:not(.color)").eq(wu).attr("alt","2")
- }
- </script>
- </head>
- <body>
吃了:<span id="ff">0</span>
- <table id="myt" align="center">
- </table>
- <!--<input type="button" class="ann" value=""><br>
- <input class="ann" type="button" value=""><input class="ann" type="button" value=""><input class="ann" type="button" value="">
- -->
- </body>
- </html>
来源: http://www.qdfuns.com/article/27845/e34db00d51fc05f0cab5a8057f5a8883.html