(^=ω=^)4 ●画像でインタラクティブおみくじ
前回までは、アラートダイアログで「大吉」とか「凶」
などを表示するものでしたが、ゲーム作りを目指すなら
やっぱ絵がないと物足りないですね、はい、わかってお
ります。
今回は(^^)/、
「画像をクリックしたらおみくじがひける」
ということでいってみます。
...前回の
「ボタンを押したらおみくじがひける」
とあんまり変わらないって?
まf^^;;
何はともあれクリックしてみましょう(^0^)/っ。
どうですか?
画像が変わったでしょ^^? そうです。画像を書き換えた
のです(^^)/。
これができればロケットが動くのだってキャラが走り回る
のだって思いのまま...かもf^^;...いや、
あまり深く考えずに下のソースをコピーして自分のページ
のHTMLの中へ張り込んでみてください。
今回からは、ソースを自分のメールアドレスへメールで送
ることもできるようにしておきました(^^)。
使った画像 :
http://web01.fureai.or.jp/~tato/GameWeb/NGWtools/dp2/ml/19/0.gif
http://web01.fureai.or.jp/~tato/GameWeb/NGWtools/dp2/ml/19/1.gif
http://web01.fureai.or.jp/~tato/GameWeb/NGWtools/dp2/ml/19/2.gif
http://web01.fureai.or.jp/~tato/GameWeb/NGWtools/dp2/ml/19/3.gif
で、参考までに...
mkrand()は
function mkrand(){ 命令 }
の命令の部分に書かれた命令を実行するという意味です。
mkrand()の中には、前々回説明した
ランダムな数を発生させてrandという名前を付けた変数
に格納しておく
rand = Math.ceil( Math.random() * 3 )
というスクリプトが入っているので
mkrand()が実行されるとここでは1〜3までのいず
れかの数がセットされます。
つまり、ここまででやっていることは、
「ページが読み込まれたら1〜3までの数をrand へセット
しておく」
ということです。
onClick='omikuji()'
は前回説明したように、ボタンを押したら...
function omikuji(){ 命令 }
の命令の部分に書かれた命令を実行するという意味です。
そしてomikuji()の中では
if(rand==1)document.images['omi1'].src='1.gif'
という処理が行われます。
これは分解すると、
if ←もし、
(rand==1) ←randが1なら
document.images['omi1'].src ←'omi1'という名前の画像を
='1.gif' ←'1.gif'に書きかえる。
という意味です。
ですから、その次の行以下も
if(rand==2)document.images['omi1'].src='2.gif'
もし、randが2なら'omi1'という名前の画像を'2.gif'に
書きかえる。
etc...
となります。
え？
いつになったらゲームになるのかって？
....う〜ん
(｀0´）あせるでないっ
| 
