<style>
#mainBox{
overflow:hidden;
position:relative;
width:320px;
height:568px;
background:url(images/background_1.png) no-repeat;
margin:30px auto 0;
}
</style>
<div id="mainBox"></div>
<script type="text/javascript" src="js/main1.js"></script>
js/main1.js
var mainBox = document.getElementById("mainBox");//获取主界面
var ourPlane = new myPlane(0,0);//创建本飞机对象实例
ourPlane.createPlane("selfPlane");//调用创建本方飞机方法 并且传入本方飞机节点ID名
var selfPlane = document.getElementById("selfPlane");//获取本方飞机节点
ourPlane.shoot();//调用本方飞机的射击方法
mainBox.onmousemove = function(e){
var e = event||window.event;
var oLeft = e.clientX - mainBox.offsetLeft - selfPlane.offsetWidth/2;
var oTop = e.clientY - mainBox.offsetTop - selfPlane.offsetHeight/2;
if(oLeft<=0){
oLeft=0;
}
if(oLeft>=(mainBox.offsetWidth-selfPlane.offsetWidth)){
oLeft = mainBox.offsetWidth-selfPlane.offsetWidth;
}
if(oTop<=0){
oTop=0;
}
if(oTop>=(mainBox.offsetHeight-selfPlane.offsetHeight)){
oTop = mainBox.offsetHeight-selfPlane.offsetHeight;
}
selfPlane.style.left = oLeft + "px";
selfPlane.style.top = oTop + "px";
mainBox.style.cursor = "none";
}
mainBox.onmouseout = function(){
mainBox.style.cursor = "";
}
function plane(x,y,hp,imgsrc,speed){
this.planex = x;
this.planey = y;
this.planeSpeed = speed;
this.hp = hp;
this.imgsrc = imgsrc;
this.createPlane = function(id){
this.planeNode = document.createElement("img");
if(id){
this.planeNode.id = id
}
this.planeNode.src = this.imgsrc;
this.planeNode.style.left = this.planex+"px";
this.planeNode.style.top = this.planey+"px";
this.planeNode.style.position = "absolute";
mainBox.appendChild(this.planeNode);
if(this.planeSpeed!=0){
this.move();
}
}
this.move = function(){
var that = this;
var step = 0;
this.time = setInterval(function(){
var bullets = document.getElementsByClassName("bullets");
step += that.planeSpeed;
that.planeNode.style.top = step + "px";
for(var i=0;i<bullets.length;i++){
if((parseInt(that.planeNode.style.left)<=parseInt(bullets[i].style.left))&&((parseInt(that.planeNode.style.left)+that.planeNode.offsetWidth)>=parseInt(bullets[i].style.left))&&((parseInt(that.planeNode.style.top)+that.planeNode.offsetHeight)>=parseInt(bullets[i].style.top))){
that.hp--;
bullets[i].parentNode.removeChild(bullets[i]);
}
}
if(that.hp<=0){
clearInterval(that.time);
that.planeNode.parentNode.removeChild(that.planeNode);
}else if(parseInt(that.planeNode.style.top) >= mainBox.offsetHeight+that.planeNode.offsetHeight){
clearInterval(that.time);
that.planeNode.parentNode.removeChild(that.planeNode);
}
},50)
}
}
function myPlane(X,Y){
plane.call(this,X,Y,1,"images/我的飞机.gif",0);
this.shoot = function(){
this.time = setInterval(function(){
oLeft = parseInt(selfPlane.style.left)+selfPlane.offsetWidth/2+"px";
oTop = selfPlane.style.top;
var myBullet = new bullet(oLeft,oTop);
myBullet.createBullet();
},100)
}
this.createEnemy = function(){
var that = this;
function enemy(X,Y,hp,imgsrc,speed){
plane.call(this,X,Y,hp,imgsrc,speed);
}
this.time1 = setInterval(function(){
for(var i=0;i<randomNum(1,3);i++){
var num = randomNum(1,10);
if(num<=6){
num = 1;
}else if(num>6&&num<=9){
num = 2;
}else{
num = 3;
}
var createX = [randomNum(16,270),randomNum(0,274),randomNum(0,210)];
var imgsrc = "images/enemy"+num+"_fly_1.png";
var enemyPlane = new enemy(createX[num-1],0,Math.pow(num,2),imgsrc,(1/num)*6);
enemyPlane.createPlane();
}
},2000)
}
this.createEnemy();
}
function bullet(X,Y){
this.bulletx = X;
this.bullety = Y;
this.createBullet = function(){
this.bulletNode = document.createElement("img");
this.bulletNode.src = "images/bullet1.png";
this.bulletNode.className = "bullets";
this.bulletNode.style.position = "absolute";
this.bulletNode.style.left = this.bulletx;
this.bulletNode.style.top = this.bullety;
mainBox.appendChild(this.bulletNode);
this.move();
}
this.move = function(){
var speed = 2;
var that = this;
this.time = setInterval(function(){
var step = 0;
step -= speed;
that.bulletNode.style.top = parseInt(that.bulletNode.style.top) + step + "px";
if(parseInt(that.bulletNode.style.top)<=0){
clearInterval(that.time);
that.bulletNode.parentNode.removeChild(that.bulletNode);
}
},1)
}
}
function randomNum(min,max){
return Math.floor(Math.random()*max+min);
}