第二个写的jquery游戏坦克大战新鲜出炉
闲话少说
代码贴出
js和css贴出来了，由于代码太长不让输了，如果想玩可以去下面去下载
- JScript code
$(function() {
$("body").append('<div class="map"></div>');
InitTank('me', {x:(long-50)/2, y:high-50}, 'up');
InitEnemy();
//键盘点击事件
$(document).keydown(function(evt) {
evt = evt || window.event;
var key = evt.which || evt.keyCode;
if(key==32)
{
SendBullet("me");
}
switch (key) {
case 37: direction = "left"; break;
case 38: direction = "up"; break;
case 39: direction = "right"; break;
case 40: direction = "down"; break;
}
if (key >= 37 && key <= 40) {
ChangeDirection('me', direction);
isMeMove = true;
}
});
$(document).keyup(function(evt) {
evt = evt || window.event;
var key = evt.which || evt.keyCode;
if (key >= 37 && key <= 40) {
isMeMove = false;
}
});
MyInterval=setInterval("Refresh()",timeSpan);
});
var isMeMove = false;
var moveLong = 10;
var bulletmoveLong = 20;
var timeSpan = 300;
var long = 600;
var high = 600;
function Refresh() {
var me = $("#me");
var mtop = $(me).position().top;
var mleft = $(me).position().left;
if (isMeMove) {
direction = $(me).attr("direction");
var offset = GetOffset(direction);
mtop += offset.y*moveLong;
mleft += offset.x*moveLong;
if(mtop<0){
mtop = 0;
}else if(mtop>long-$(me).height())
{
mtop = long-$(me).height();
}
if(mleft<0){
mleft = 0;
}else if(mleft>long-$(me).width())
{
mleft = long-$(me).width();
}
$(me).css({'top':(mtop + 'px'),'left':(mleft + 'px')});
}
$(".tank:visible[enemy='enemy']").each(function(){
var etop = $(this).position().top;
var eleft = $(this).position().left;
var bullettime = parseInt($(this).attr("bullettime"));
if(bullettime<=0)
{
bullettime = 10;
var topSpan = etop-mtop;
var leftSpan = eleft-mleft;
ex = Math.abs(leftSpan)>Math.abs(topSpan)?leftSpan/Math.abs(leftSpan)*-1:0;
ey = Math.abs(leftSpan)>Math.abs(topSpan)?0:topSpan/Math.abs(topSpan)*-1;
etop = etop + ey*moveLong;
eleft = eleft + ex*moveLong;
var direction = GetDirection({x:ex,y:ey});
ChangeDirection($(this).attr("id"),direction);
SendBullet($(this).attr("id"));
}else
{
direction = $(this).attr("direction");
var offset = GetOffset(direction);
etop = etop + offset.y*moveLong;
eleft = eleft + offset.x*moveLong;
bullettime--;
}
if(etop<0){
etop = 0;
}else if(etop>long-$(this).height())
{
etop = long-$(this).height();
}
if(eleft<0){
eleft = 0;
}else if(eleft>long-$(this).width())
{
eleft = long-$(this).width();
}
$(this).css({'top':(etop + 'px'),'left':(eleft + 'px')}).attr("");
$(this).attr("bullettime",bullettime);
});
$(".bullet:visible").each(function(){
direction = $(this).attr("direction");
var offset = GetOffset(direction);
var top = $(this).position().top + offset.y*bulletmoveLong;
var left = $(this).position().left + offset.x*bulletmoveLong;
if(top<0){
$(this).hide();
return;
}else if(top>long-$(this).height())
{
$(this).hide();
return;
}
if(left<0){
$(this).remove();
return;
}else if(left>long-$(this).width())
{
$(this).remove();
return;
}
$(this).css({'top':(top + 'px'),'left':(left + 'px')},timeSpan);
});
CheckBullet();
CheckTank();
CheckBulletTank();
}
//判断子弹相碰
function CheckBullet()
{
$(".bullet[owner='me']:visible").each(function(){
var me = this;
$(".bullet[owner!='me']:visible").each(function(){
if(IsCollision(me,this))
{
$(me).hide();
$(this).hide();
}
});
});
}
//判断坦克相碰
function CheckTank()
{
var me = $("#me");
$(".tank").not("#me").each(function(){
if(IsCollision(me,this))
{
alert("被坦克"+$(this).attr("id")+"打死了");
Failure();
}
});
}
//判断子弹打在坦克上
function CheckBulletTank()
{
var me = $("#me");
$(".bullet[owner!='me']:visible").each(function(){
if(IsCollision(me,this))
{
alert("被子弹"+$(this).attr("id")+"打死了");
Failure();
}
});
$(".bullet[owner='me']:visible").each(function(){
var fme = this;
$(".tank").not("#me").each(function(){
if(IsCollision(fme,this))
{
$(this).hide();
$(fme).hide();
InitEnemy();
}
});
});
}
//根据方向返回偏移量
function GetOffset(direction)
{
ox = 0;
oy = 0;
if(direction=='left')
{
ox = -1;
oy = 0;
}else if(direction=='right')
{
ox = 1;
oy = 0;
}else if(direction=='up')
{
ox = 0;
oy = -1;
}else if(direction=='down')
{
ox = 0;
oy = 1;
}
return {x:ox,y:oy};
}
//获取方向
function GetDirection(offset)
{
var direction = 'down';
if(offset.x==-1 && offset.y==0)
{
direction = 'left' ;
}else if(offset.x==1 && offset.y==0)
{
direction = 'right' ;
}else if(offset.x==0 && offset.y==-1)
{
direction = 'up' ;
}else if(offset.x==0 && offset.y==1)
{
direction = 'down' ;
}
return direction;
}
//发送炮弹
function SendBullet(tid)
{
if($(".bullet[owner='" + tid + "']:visible").size()<2)
{
var x = $("#"+tid).position().left;
var y = $("#"+tid).position().top;
var direction = $("#"+tid).attr("direction");
var offset = GetOffset(direction);
var ox = x+offset.x*20+(offset.x==1?30:20);
var oy = y+offset.y*20+(offset.y==1?30:20);
if($(".bullet:hidden").size()==0)
{
$(".map").append($('<div class="bullet" style="left:' + ox + 'px;top:' + oy + 'px;" direction="' + direction + '" owner="' + tid + '"></div>'));
}else
{
$(".bullet:hidden").eq(0).css({left: ox + 'px',top: oy + 'px'}).attr("direction",direction).attr("owner",tid).show();
}
}
}
//初始化敌人
function InitEnemy()
{
if($("#enemy1:hidden").size()==0)
{
InitTank('enemy1', {x:(Math.round(Math.random()*3)-1)*((long-50)/2), y:0}, 'down');
}else
{
$("#enemy1").css({left:(Math.round(Math.random()*3)-1)*((long-50)/2)+"px",top:0}).show();
}
$("#enemy1").attr("enemy",'enemy').attr("bullettime","10");
SendBullet("enemy1");
}
//初始化坦克
//tid 坦克id
//x横坐标（left值）
//y纵坐标（top值）
//方向
function InitTank(tid,position, direction) {
x = position.x < 0 ? 0 : position.x;
x = position.x > 600 ? 600 : position.x;
y = position.y < 0 ? 0 : position.y;
y = position.y > 600 ? 600 : position.y;
$(".map").append('<div id="' + tid + '" style="left:' + position.x + 'px;top:' + position.y + 'px;" direction="' + direction + '" class="tank ' + direction + '"></div>');
}
//改变坦克的方向
function ChangeDirection(tid, direction) {
$("#" + tid).removeClass($("#" + tid).attr("direction")).addClass(direction).attr("direction", direction);
}
//判断两个元素是否碰撞
function IsCollision(obja,objb)
{
var objaInfo = {width:$(obja).width(),height:$(obja).height(),left:$(obja).position().left,top:$(obja).position().top};
var objbInfo = {width:$(objb).width(),height:$(objb).height(),left:$(objb).position().left,top:$(objb).position().top};
if(objaInfo.left<objbInfo.left)
{
if(objaInfo.left+objaInfo.width<=objbInfo.left)
{
return false;
}
}else
{
if(objbInfo.left+objbInfo.width<=objaInfo.left)
{
return false;
}
}
if(objaInfo.top<objbInfo.top)
{
if(objaInfo.top+objaInfo.height<=objbInfo.top)
{
return false;
}
}else
{
if(objbInfo.top+objbInfo.height<=objaInfo.top)
{
return false;
}
}
return true;
}
function success()
{
clearInterval(MyInterval);
alert("您获胜了");
}
function Failure()
{
clearInterval(MyInterval);
alert('结束了');
}