html5 手把手教你做游戏《熊和蘑菇》(六)

预期达到的效果：http://www.html5china.com/html5games/mogu/index5.html
由于奖品特别多，而且是有序的，所以我们使用一个数组来装所有奖品的位置
一、需要到的全局变量
JavaScript Code复制内容到剪贴板
1. var flowerImg = new Image();//奖品鲜花  
2. var leafImg = new Image();//奖品叶子  
3. var acornImg = new Image();//奖品橡子  
鲜花图片下载：http://www.html5china.com/html5games/mogu/images/flower.png
叶子图片下载：http://www.html5china.com/html5games/mogu/images/leaf.png
橡子图片下载：http://www.html5china.com/html5games/mogu/images/acorn.png
二、初始化托全局变量
JavaScript Code复制内容到剪贴板
1.   //加载图片     
2.   function LoadImages()     
3.   {     
4.       mushroomImg.src = "images/mushroom.png";//蘑菇     
5.       backgroundForestImg.src = "images/forest1.jpg";//森林背景图    
6.       bearEyesClosedImg.src = "images/bear_eyesclosed.png";//闭着眼睛的  
7.       flowerImg.src = "images/flower.png";//奖品花  
8.       acornImg.src = "images/acorn.png";//奖品橡子  
9.       leafImg.src = "images/leaf.png";//奖品叶子  
10.  
11.       mushroom.image = mushroomImg;     
12.       animal.image = bearEyesClosedImg;  
13.   }  

三、定义奖品数据及实例
JavaScript Code复制内容到剪贴板
1. //定义奖品数组Prizes和对象Prize，继承游戏对象GameObject  
2. var prizes = new Array();  
3. function Prize() {};  
4. Prize.prototype = new GameObject();//继承游戏对象GameObject  
5. Prize.prototype.row = 0;//奖品行位置  
6. Prize.prototype.col = 0;//奖品列位置 
四、把奖品装进数组
JavaScript Code复制内容到剪贴板
1. //创建奖品数组  
2. function InitPrizes()  
3. {  
4.     var count=0;  
5.     //一共3行  
6.     for(var x=0; x<3; x++)  
7.     {  
8.         //一共23列  
9.         for(var y=0; y<23; y++)  
10.         {  
11.             prize = new Prize();  
12.             if(x==0)  
13.                 prize.image = flowerImg;//鲜花放在第一行  
14.             if(x==1)  
15.                 prize.image = acornImg;//豫子刚在第2行  
16.             if(x==2)  
17.                 prize.image = leafImg;//叶子放在第3行  
18.                   
19.             prize.row = x;  
20.             prize.col = y;  
21.             prize.x = 20 * prize.col + 10;//x轴位置  
22.             prize.y = 30 * prize.row + 20;//y轴