贪吃蛇碰到自己就会死的html5代码

贪吃蛇碰到自己就会死的html5代码,第1张

snake.js

代码如下:::

复制代码

代码如下:

var canvas

var ctx

var timer

//measures

var x_cnt = 15

var y_cnt = 15

var unit = 48

var box_x = 0

var box_y = 0

var box_width = 15 * unit

var

box_height = 15 * unit

var bound_left = box_x

var bound_right = box_x

+ box_width

var bound_up = box_y

var bound_down = box_y + box_height

//images

var image_sprite

//objects

var snake

var food

var food_x

var food_y

//functions

function Role(sx, sy, sw,

sh, direction, status, speed, image, flag)

{

this.x = sx

this.y =

sy

this.w = sw

this.h = sh

this.direction = direction

this.status = status

this.speed = speed

this.image = image

this.flag = flag

}

function transfer(keyCode)

{

switch

(keyCode)

{

case 37:

return 1

case 38:

return 3

case

39:

return 2

case 40:

return 0

}

}

function addFood()

{

//food_x=box_x+Math.floor(Math.random()*(box_width-unit))

//food_y=box_y+Math.floor(Math.random()*(box_height-unit))

food_x =

unit * Math.floor(Math.random() * x_cnt)

food_y = unit *

Math.floor(Math.random() * y_cnt)

food = new Role(food_x, food_y, unit,

unit, 0, 0, 0, image_sprite, true)

}

function play(event)

{

var

keyCode

if (event == null)

{

keyCode = window.event.keyCode

window.event.preventDefault()

}

else

{

keyCode =

event.keyCode

event.preventDefault()

}

var cur_direction =

transfer(keyCode)

snake[0].direction = cur_direction

}

function

update()

{

//add a new part to the snake before move the snake

if

(snake[0].x == food.x &&snake[0].y == food.y)

{

var length =

snake.length

var tail_x = snake[length - 1].x

var tail_y =

snake[length - 1].y

var tail = new Role(tail_x, tail_y, unit, unit,

snake[length - 1].direction, 0, 0, image_sprite, true)

snake.push(tail)

addFood()

}

//modify attributes

//move the head

switch

(snake[0].direction)

{

case 0: //down

snake[0].y += unit

if

(snake[0].y >bound_down - unit)

snake[0].y = bound_down - unit

break

case 1: //left

snake[0].x -= unit

if (snake[0].x <

bound_left)

snake[0].x = bound_left

break

case 2: //right

snake[0].x += unit

if (snake[0].x >bound_right - unit)

snake[0].x = bound_right - unit

break

case 3: //up

snake[0].y

-= unit

if (snake[0].y <bound_up)

snake[0].y = bound_up

break

}

//move other part of the snake

for (var i = snake.length - 1i

>= 0i--)

{

if (i >0)

//snake[i].direction=snake[i-1].direction

{

snake[i].x = snake[i -

1].x

snake[i].y = snake[i - 1].y

}

}

}

function

drawScene()

{

ctx.clearRect(box_x, box_y, box_width, box_height)

ctx.strokeStyle = "rgb(0,0,0"

ctx.strokeRect(box_x, box_y, box_width,

box_height)

//detection collisions

//draw images

for (var i = 0i

<snake.lengthi++)

{

ctx.drawImage(image_sprite, snake[i].x,

snake[i].y)

}

ctx.drawImage(image_sprite, food.x, food.y)

}

function init()

{

canvas = document.getElementById("scene")

ctx

= canvas.getContext('2d')

//images

image_sprite = new Image()

image_sprite.src = "images/sprite.png"

image_sprite.onLoad = function

()

{}

//ojects

snake = new Array()

var head = new Role(0 *

unit, 0 * unit, unit, unit, 5, 0, 1, image_sprite, true)

snake.push(head)

window.addEventListener('keydown', play, false)

addFood()

setInterval(update, 300)//note

setInterval(drawScene, 30)

}

望采纳!!!!

我从百度知道上了解了很多轻松的网页休闲游戏。

1.贪吃蛇方块

参加人数:全员参加

游戏规则:贪吃蛇与方块是一款休闲益智的游戏,通过移动贪吃蛇的位置来获得食物并加长贪吃蛇的长度,然后通过方块障碍物,通过的障碍物越多,积分排名越高呢,一起来比一比吧!

2. tomegame水果英雄

参加人数:全员参加

游戏规则:水果英雄是一款反应类的游戏,通过滑动手指切各种水果,但是要注意躲避炸d哦,不小心滑到炸d是会扣除积分的,积分清零游戏就结束啦,大家加油!

3. 兔子快跑

参加人数:全员参加

游戏规则:兔子快跑是一款跑酷类的游戏,通过手指左右滑动来获得宝石,上下滑动跳过障碍物,在这里千万要注意躲避障碍物呀,不然就提前结束游戏啦!

最后的那个 <body>请改为 </body>

并把前面的 <script>xxx</script>这大块放到 </body>前面。

因为你在执行 js 的时候 dom 都没有加载呢,所以要放到后面,或者把整个 js 放到 window.onload = function(){xxx}里面


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/zaji/6096332.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-03-14
下一篇 2023-03-14

发表评论

登录后才能评论

评论列表(0条)

保存