频道栏目
首页 > 程序开发 > web前端 > JavaScript > 正文
js小游戏开发:js贪吃蛇
2017-07-17 15:36:32      个评论    来源:yl107的博客  
收藏   我要投稿

js小游戏开发:js贪吃蛇。

Document

*{

margin: 0;

padding: 0;

}

.wrap{

width: 600px;

margin: 0 auto;

position: relative;

}

p{

position: absolute;

left: 65%;

top: 10%;

}

h1{

text-align: center;

margin-bottom: 20px;

}

#score{

text-align: center;

font-size: 20px;

}

#map{

margin: 0 auto;

border: 1px solid skyblue;

}

.row{

height: 20px;

}

.col{

height: 20px;

width: 20px;

box-sizing:border-box;

border: 1px solid lightgray;

background: rgb(250,250,250);

float: left;

}

.activeSnake{

background:black;

}

.egg{

background: red;

}

#Pause{

margin-left: 18%;

border: 1px solid skyblue;

color: white;

background: skyblue;

width: 50px;

height: 30px;

margin-bottom: 10px;

border-radius: 5px;

}

#Start,#Refresh{

border: 1px solid skyblue;

background: skyblue;

color: white;

width: 50px;

height: 30px;

border-radius: 5px;

margin-left: 15px;

}

贪吃蛇游戏

score:0

var score = document.getElementById('score');

var map = document.getElementById('map');

var rownumber = 25;

var columnnumber = 20;

map.style.height = rownumber*20 + 'px';

map.style.width = columnnumber*20 + 'px';

var snakepositior = [];

for(var i=0; i

点击复制链接 与好友分享!回本站首页
上一篇:js自定义滚动轴
下一篇:javascript事件委托
相关文章
图文推荐
点击排行

关于我们 | 联系我们 | 广告服务 | 投资合作 | 版权申明 | 在线帮助 | 网站地图 | 作品发布 | Vip技术培训

版权所有: 红黑联盟--致力于做实用的IT技术学习网站