游戏加载中状态

游戏加载中的图片

用一个数组将图片装起来

var loading=[];             loading[0]=new Image;             loading[0].src="img/game_loading1.png"             loading[1]=new Image;             loading[1].src="img/game_loading2.png"             loading[2]=new Image;             loading[2].src="img/game_loading3.png"             loading[3]=new Image;             loading[3].src="img/game_loading4.png"

定义一个对象储存图片的数据

var Loading={                img:loading,                length:loading.length,                width:186,                height:38            }

使用构造函数绘制加载中的图片

函数中需要定义一个索引，再用paint的方法绘制图片，

在step的方法中让索引每次都加1，让图片产生变化，当索引值对于数组的长度时将游戏状态定为RUNNING

function jz(ld){                 this.img=ld.img;                 this.length=ld.length;                 this.width=ld.width;                 this.height=ld.height;//               定义一个索引,方面查找图片                this.starindex=0//               绘制图片的方法paint                this.paint=function(){                  context.drawImage(this.img[this.starindex],0,HEIGHT-this.height);              }//              运动的方法step                this.time=0                this.step=function(){                    this.time++                    if(this.time%3==0){                    this.starindex++}                    if (this.starindex == this.length) {                        start=RUNNING                    }                }             }

 创建运动图片的对象

var sky1=new jz(Loading)

给canvas绑定点击事件

   当点击画布界面是进入START状态    

canvas.οnclick=function(){              if(start==START){               start=STARTING;              }             }

定时器调用paint和step方法