ベストアンサー

文字を隠すゲーム

2007/02/25 04:44

ゲームを作っています。ページを更新するたびに２０種類のことわざから１つが表示されます。１文字ずつテーブルのセルにいれていくのですが、隠れています。文字の隠れてる部分をクリックすると文字が現れるのですが、文字数の半分が現れたら　プロンプトで「ことわざを予想してください」と表示。ユーザに答えさせる、というゲームです。文字数の半分、文字を隠すをイベントハンドラで表現したのですが、左から半分の文字だけが現れる関数になってしまいました。ことわざの文字数が半分現れたら…　という状況にしたいのですが、行き詰ってます。コードは以下のとおりです。何かアドバイスをいただけないでしょうか。 <script language="JavaScript"> "); document.write ("</style>"); } function setEvent(){ if (!document.getElementById) return; var elms = document.getElementsByTagName("span"); for(i = 0; i < elms.length/2; i++){ elms[i].onclick=show; } } function show(e){ if(window.event) obj =window.event.srcElement; else if(e) obj = e.currentTarget; obj.style.backgroundColor="ivory"; obj.style.color="black"; } //--> </script>

ilnmfay
お礼率75% (137/181)

JavaScript
回答数2
ありがとう数3

みんなの回答 （2）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

leap_day
ベストアンサー率60% (338/561)

2007/02/25 08:27 回答No.1

こんにちは表示部が無い様でそのままコピペしても真っ白だったのでちょっと創ってみました（HTML仕様です)（＾＾）参考になればいいのですが・・・テーブル部と諺の数は意図的に減らしてるので増やしてくださいね <body onLoad="setText()"> <SCRIPT language="JavaScript"> m = 0, x = 0, y = 0; str = new Array(); adv = new Array(); hit = new Array(); hit[0] = 1; adv[0] = '棚から牡丹餅'; hit[1] = 1; adv[1] = '猿も木から落ちる'; hit[2] = 1; adv[2] = '石の上にも三年'; hit[3] = 1; adv[3] = '光陰矢のごとし'; hit[4] = 1; adv[4] = '犬も歩けば棒に当る'; for(i=0; i<=hit.length - 1; i++) { m += hit[i]; } n = Math.floor(Math.random() * m); n++; for(i=0; i<=hit.length - 1; i++) { x = y; y += hit[i]; if(x<n && n<=y) str = adv[i]; } function setText() { if(document.all)document.all["ID"].innerHTML=str; document.all["ID"].style.color = "#ffffff"; document.all["ID"].style.display = "none"; } //-->  </SCRIPT> <DIV id="ID"></DIV><BR> <form name="form"> <table border="1"> <tr height="20"> <td width="20" onClick="strFade('0','ID0')" style="cursor:hand;"><span id="ID0"> </span></td> <td width="20" onClick="strFade('1','ID1')" style="cursor:hand;"><span id="ID1"> </span></td> <td width="20" onClick="strFade('2','ID2')" style="cursor:hand;"><span id="ID2"> </span></td> <td width="20" onClick="strFade('3','ID3')" style="cursor:hand;"><span id="ID3"> </span></td> <td width="20" onClick="strFade('4','ID4')" style="cursor:hand;"><span id="ID4"> </span></td> <td width="20" onClick="strFade('5','ID5')" style="cursor:hand;"><span id="ID5"> </span></td> </tr></table> </form>

質問者

お礼 2007/02/25 12:05

回答ありがとうございました。少し、質問の仕方が悪かったようなので、新しい質問を立ち上げます。ご協力ありがとうございました。

質問者

補足 2007/02/25 10:38

回答ありがとうございます。 javascriptの一部しかのせずに、わかりにくい質問になっていたことに気づきました。すみません。それにもかかわらず回答ありがとうございます。回答者さんのプログラムをコピーしたのですが、うまくいきませんでした。これは、回答者さんのコンピュータでは動きました？？ちなみに現時点での僕のプログラムは以下のとおりです。 ↓ <!DOCTYPE html PUBLIC "-//w3c//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title> Game </title> <script language="JavaScript"> "); document.write ("</style>"); } function setEvent(){ if (!document.getElementById) return; var elms = document.getElementsByTagName("span"); for(i = 0; i < elms.length/2; i++){ elms[i].onclick=show; } } function show(e){ if(window.event) obj =window.event.srcElement; else if(e) obj = e.currentTarget; obj.style.backgroundColor="ivory"; obj.style.color="black"; } function hide(e){ if(window.event) obj =window.event.srcElement; else if(e) obj = e.currentTarget; obj.style.backgroundColor="lavender"; obj.style.color="lavender"; } //--> </script> </head> <body onload="setEvent();"> <script type ="text/javascript">  </script> </body> </html>

その他の回答 (1)

ANASTASIAK
ベストアンサー率19% (658/3306)

2007/02/25 11:38 回答No.2

そもそも論で恐縮ですが・・・お考えの発想では、隠されている文字のところをマウスでドラッグすると正解が見えてしまいます。各文字を画像化してダミー画像と差し替えるようにするとかするのがよいのではと思いますが。

質問者

お礼 2007/02/25 12:04

助言ありがとうございます。確かにその通りです。

文字を隠すゲーム