- 浏览: 267564 次
- 性别:
- 来自: 深圳
最新评论
-
zhaoaifeiyu:
楼主真是幽默,不过我看这个帖子居然是13年的。。。 我感觉我 ...
Java使用Tess4J 进行图片文字识别 笔记 -
wangzihui:
你好,能给我一个完整的代码么?我按照你的写出来后,汉字全是乱码 ...
Java使用Tess4J 进行图片文字识别 笔记 -
piaolin7:
[color=orange] ...
Java使用Tess4J 进行图片文字识别 笔记 -
xulei1992:
打开只有一个读到一半的进度条啊亲
连连看-js -
chenhailong:
楼主请问下你上面那个图是怎么画的?是用什么工具?
Java7语法新特性
这几天闲来无事写的。
算是总结了一下这段时间以来学到的jQuery 和 JavaScript .偏向地用到了JavaScript 自定义对象 .JavaScript 的"基于对象 "到底是个什么东西?一直没搞明白.
HTML 代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>蛇</title> <script type="text/javascript" src="js/jquery-1.4.1.js"></script> <script type="text/javascript" src="js/snake.js"></script> <link href="css/snake.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="panel"></div> <a id="info" href="http://zhouxianglh.iteye.com/"></a> </body> </html>
CSS 代码:
@CHARSET "UTF-8"; .snack { background-color: #3C0; } .floor { background-color: #999; } .food { background-color: #FC0; } a:link,a:hover,a:visited { color: #F0F; text-decoration: none; }
JavaScript 代码:
//贪吃蛇 isw2 zhouxianglh 2010.06.08 var gamePanel = null; var gameDriver = null; var runPath = 1;//1左,2右,3上,4下 指令方向 var snackrunPath = runPath;//蛇跑的方向 //开始游戏 $(document).ready(function(){ gameStart(); }); //游戏开始 function gameStart(){ gamePanel =new panelSnack(); gamePanel.init(); gameDriver = setInterval("gameRun();", gamePanel.time); } //游戏运行一次 function gameRun() { gamePanel.snakeObj.run(); } //游戏结束 function gameStop(){ clearTimeout(gameDriver);//结束定时器 } //蛇的键盘控制 function keyControl(keyCode) { if (keyCode == 39 && snackrunPath != 2) {//左 runPath = 1; } else if (keyCode == 37 && snackrunPath != 1) {//右 runPath = 2; } else if (keyCode == 38 && snackrunPath != 4) {//上 runPath = 3; } else if (keyCode == 40 && snackrunPath != 3) {//下 runPath = 4; } } //面板 function panelSnack(){ this.rowNum = 20;//行 this.conNum = 20;//列 this.cellSize = 20;//大小 this.snakeObj = null;//蛇 this.time= 300;//定时器 this.totalFood=0;//显示的食物数量 //判断物体 this.is = function(testX, testY) { var id="c" + testX + "_" + testY; if (null == $("#"+id)[0]) { return "null";//撞墙 } else if ($("#"+id).attr("class") == "floor") { return "normal";//正常 } else if ($("#"+id).attr("class")== "snack") { return "body";//自己 } else if ($("#"+id).attr("class") == "food") { return "food";//食物 } }; //随机食物 this.createFood = function () { var randomX; var randomY; { randomX = Math.floor(Math.random() * this.conNum); randomY = Math.floor(Math.random() * this.rowNum); }while($("#c" + randomX + "_" + randomY).attr("class")=="floor")//随机食物 $("#c" + randomX + "_" + randomY).attr("class","food"); this.totalFood ++;//食物数量 $("#info").text("吃第"+(this.totalFood-1)+"块肉了!"); }; //初始化 this.init = function(){ var pWidth = this.conNum * this.cellSize; var pHeight = this.rowNum * this.cellSize; var pTop = ($(document).height() - pHeight) / 2; var pLeft = ($(document).width() - pWidth) / 2; $("#panel").html("");//清空panel Div //设置panel Div样式 $("#panel").css({left:pLeft + "px", top:pTop + "px", width:pWidth + "px", height:pHeight + "px", position:"fixed"}); //设置单元格 for (var r = 0; r < this.rowNum; r++) { for (var c = 0; c < this.conNum; c++) { var cellStyle = "style=\"left: " + c * this.cellSize + "px; top: " + r * this.cellSize + "px; width: " + this.cellSize + "px; height: " + this.cellSize + "px; position: absolute;\""; var cellClass = " class='floor'"; var cellId = "id=\"c" + c + "_" + r + "\""; var cellHtml = "<div "+ cellId + cellStyle + cellClass + "></div>"; $("#panel").append(cellHtml); } } this.snakeObj = new snake(0,0,2,0,this);//初始化蛇 this.snakeObj.init();//初始化蛇 } } //蛇 function snake(snakeTailX, snakeTailY, snakeHeadX, snakeHeadY,panelSnack) { this.headTitle = snakeHeadX;//头标号 this.tailTitle = snakeTailX;//尾标号 //初始化蛇 this.init = function(){ //初始化蛇 for(var i = snakeTailX;i <= snakeHeadX;i ++){ $("#c" + i + "_" + snakeTailY).attr("class","snack"); $("#c" + i + "_" + snakeTailY).attr("title",parseInt(i)); } //添加食物 panelSnack.createFood(); //添加事件 $(document).ready(function () { //键盘事件 $(document).keydown(function(event){ keyControl(event.keyCode) }); }) } //蛇运行 this.run = function () { snackrunPath = runPath;//设置蛇跑的方向 if (snackrunPath == 1) { snakeHeadX += 1; } else if (snackrunPath == 2) { snakeHeadX -= 1; } else if (snackrunPath == 3) { snakeHeadY -= 1; } else if (snackrunPath == 4) { snakeHeadY += 1; } var result = panelSnack.is(snakeHeadX,snakeHeadY); if (result == "normal") { this.tailForward();//尾部向前 this.headForward();//头部向前移动 } else if (result == "food") { this.headForward();//头部向前移动 //添加食物 panelSnack.createFood(); } else if (result == "body") { gameStop(); alert("吃到自己了哈!F5刷新重来."); } else if (result == "null") { gameStop(); alert("小青它撞死了!F5刷新重来."); } }; //头部向前移动 this.headForward = function(){ $("#c" + snakeHeadX + "_" + snakeHeadY).attr("class","snack"); $("#c" + snakeHeadX + "_" + snakeHeadY).attr("title",parseInt(++this.headTitle)); } //尾部向前移动 this.tailForward = function (){ $("#c" + snakeTailX + "_" + snakeTailY).attr("class","floor");//尾巴切掉 this.tailTitle ++;//尾部标号+1 if ($("#c" + (snakeTailX + 1) + "_" + snakeTailY).attr("title") == this.tailTitle) { snakeTailX += 1; }else if ($("#c" + (snakeTailX - 1) + "_" + snakeTailY).attr("title") == this.tailTitle) { snakeTailX -= 1; }else if ($("#c" + snakeTailX + "_" + (snakeTailY - 1)).attr("title") == this.tailTitle) { snakeTailY -= 1; }else if ($("#c" + snakeTailX + "_" + (snakeTailY + 1)).attr("title") == this.tailTitle) { snakeTailY += 1; } } }
- snack.rar (44.1 KB)
- 下载次数: 6
发表评论
-
JavaScript 对象
2013-06-13 17:50 901<html> <head> &l ... -
ajax小结
2010-11-11 08:20 1169昨天笔试,杯具,SQL的 ... -
Json 在 IE6下出错
2010-09-17 15:59 1483前些天写的js 在IE6下出错,因为电脑上用的是IE8+ff ... -
连连看-js
2010-07-17 09:49 2104前几天写了,算是一个小小的总结吧. //连连看 2010. ... -
jQuery1.4.1 代码分析(3多库共存,数据缓存,队列控制)
2010-07-13 15:21 1272jQuery 分析中出了很多疑问,都不能解决,代码能看懂,但搞 ... -
jQuery1.4.1 代码分析(2对象访问,插件机制)
2010-07-09 16:57 1195jQuery 的核心分为 jQuery 核心函数 j ... -
jQuery1.4.1 代码分析(1核心函数)
2010-07-08 15:29 1119学习一段时间了,算是总结一下吧.有部分暂时不能完全看明白.用& ... -
JavaScript 随手小记
2010-07-06 15:51 1004前些时间看了<JavaScript 权威指南>,信 ... -
jQuery 实现上下,左右滑动
2010-07-01 11:06 21172前几天的任务:http://t.sina.com.cn/ 的 ... -
jQuery 表格排序
2010-06-02 16:27 2270<!DOCTYPE html PUBLIC " ... -
javaScript 实现的年月日三级联动
2010-05-29 01:26 2415// JavaScript Document 2010-06 ... -
Google map api的使用
2010-04-30 13:42 1679google map api google map ... -
JQuery 事件(3)
2010-04-29 15:09 1033JS美化,压缩http://js.clicki ... -
JQuery 选择器(2)
2010-04-28 17:31 929<!DOCTYPE html PUBLIC " ... -
JQuery 的使用(1)
2010-04-28 11:15 1151<!DOCTYPE HTML PUBLIC " ... -
打开MSN,QQ对话框
2010-03-13 11:34 3134下面是一个用超链打开QQ临时对话框的代码 <html& ... -
DIV和Image 的一些JavaScript 操作
2010-02-25 16:42 1490<html> <head> < ... -
Javascript 中正则表达示的使用
2010-02-09 14:55 948<script language="javas ... -
JavaScript 中自定义对象
2010-02-08 11:48 810http://www.ccvita.com/94.html ... -
JavaScript 操作CSS类
2010-02-05 16:59 1494<!DOCTYPE html PUBLIC " ...
相关推荐
用JavaScript写的贪吃蛇游戏,键盘方向键控制方向,“+”键加速,"-"键减速。
贪食蛇 贪吃蛇 基础 很有意思
使用原生JavaScript 写一个贪吃蛇小项目,帮你快速学习JavaScript相关的碰撞检测方法。
将上述逻辑整合到一起,一个完整的JavaScript贪吃蛇游戏大致如下: ```javascript // 初始化 // ... document.addEventListener('keydown', (event) => { // ... }); function gameLoop() { // ... ...
蛇可以通过继承一个基础的移动对象来实现,这个移动对象可以有一个`move()`方法,用于更新蛇的位置。同时,蛇还需要一个`grow()`方法,用于在吃掉食物后增加蛇的身体部分。 2. **Food** 对象:表示随机生成的食物,...
用纯JavaScript语言编写的贪吃蛇功能,同时还具有自动运行的观摩功能
总结,JavaScript实现的贪吃蛇游戏是一个很好的学习项目,它涵盖了事件处理、数据结构、算法以及基本的动画制作。通过这样的实践,开发者可以深入理解JavaScript的运行机制,并提升编程能力。无论你是初学者还是有...
javascript基于jquery写的贪吃蛇 没写死亡的那部分 仅供新手学习 操作方向键上下左右
javascript 写的贪吃蛇游戏,内包括一个HTML DOM操作的小工具和贪吃蛇游戏的代码,注释很详细
本文将详细介绍如何用JavaScript编写一个基本的贪吃蛇游戏。 首先,我们要理解游戏的基本逻辑。贪吃蛇游戏的核心是蛇的移动、食物的生成以及碰撞检测。蛇由一系列坐标点组成,每次移动时,蛇头会向一个方向移动一格...
总的来说,JavaScript贪吃蛇游戏是一个很好的实践项目,它涵盖了JavaScript的基础语法、对象操作、事件处理以及基本的游戏逻辑。通过学习和理解这个游戏,你不仅能提高JavaScript编程技能,还能培养逻辑思维能力和...
原生javascript写的贪吃蛇小游戏
JavaScript贪吃蛇是一款基于网页的经典小游戏,利用JavaScript、jQuery等技术实现。JavaScript是浏览器端的主要脚本语言,负责处理游戏的逻辑和用户交互,而jQuery则简化了DOM操作和事件处理,让代码更加简洁易懂。 ...
JavaScript贪吃蛇小游戏是一款基于网页的互动娱乐项目,利用JavaScript编程语言实现。JavaScript是一种轻量级的解释型编程语言,广泛应用于网页和网络应用开发,它允许在浏览器端执行代码,为用户提供动态交互的体验...
【标题】"javascript期末项目-贪吃蛇.zip"是一个基于JavaScript技术实现的期末项目,它构建了一个经典的小游戏——贪吃蛇。这个项目展示了开发者在JavaScript编程上的技能和对游戏逻辑的理解。 【描述】提到的“蛇...
今天又无事可做了,突发奇想用原生JS写了个网页贪吃蛇,先把原始代码贴过来,有兴趣的童鞋可以把下面的代码保存成JS文件,自己引进网页试一下,有什么bug可以留言。
分享一个基于JavaScript的贪吃蛇游戏源码,纯手写,如果对我的代码有更好的建议,可以给我留言。
- **数据结构**:蛇的身体由一系列坐标点组成,通常存储在一个数组中。食物位置也是一个坐标点。 3. **键盘控制** - **事件监听器**:使用`addEventListener`方法监听键盘事件,当用户按下方向键时,改变蛇的移动...