2013年10月6日日曜日

皿割りアプリ作り ランダムに画像表示と確率変更

皿割りアプリ作り

参考のソースサイトを見ながら、ランダムに画像を表示させる方法と、その確率を変更させるプログラムを組んだ。
ここまで作るのに半日くらいかかったー。
でも、動いたときの感動が半端なかった。


//画像を配列に格納する
var img = new Array(); //Array 配列

img[0] =  new Image();
img[0].src = "./images/judge1.png";
img[1] = new Image();
img[1].src = "./images/judge2.png";
img[2] = new Image();
img[2].src =  "./images/judge3.png";
img[3] = new Image();
img[3].src = "./images/judge4.png";

//画像番号用のグローバル変数
var i = 0; //なぜグローバル変数?なぜ0を使用?

//画像切り替え関数
function changeIMG(){

//ランダムに画像を表示する
i = Math.floor(Math.random() * 100);
cnt = 0; //0~1 2%
if (i > 1) cnt = 1; //2~3 2%
if (i > 3) cnt = 2; //4~5 2%
if (i > 5) cnt = 3; //6~99 94%


//画像を切り替える
document.getElementById("saraID").src=img[cnt].src;
}


<参考サイト>
http://www.pori2.net/js/DOM/3.html#top
http://www.shurey.com/js/samples/2_msg4.html

0 件のコメント:

コメントを投稿