日・英神経衰弱ゲームを作ってみる
・目次
1.目的
・html,css,javascriptの学習の1つとして、自分で考えて簡単なゲームを作ってみる。
・この記事では、そのゲームの内容について記載する。
・作成する過程で勉強した内容を随時ブログにまとめていく。
(完成まで作れるかは不明)
2.ゲームの内容
(1) 日本語と英語の単語の意味が同じ組み合わせを当てる神経衰弱ゲーム
(2) 2×4つ 組み合わせカードを用意し、カードをクリックすると、表(日本語又は英語の単語が表示される)になる。
(3) 2回クリックし、その組み合わせが合っていれば正解。間違っていれば不正解とする。
→正解した場合:下にカードを移動する。
→不正解の場合:元の場所に戻す。
(4) 単語の種類は、2(日本語、英語)×4用意。
(5) リセットボタンを押すと、全てのカードを元に戻し、ランダムで再配置する。
(6) ヒントボタンを押すと、4つの英、単語の組み合わせをフラッシュ形式で1秒程度表示していく。(秒数については、作成してみて要検討)
3.作成手順の検討
(1) カードをCSSで用意する。(2×8)
(2) カードに単語を表示する。(javascriptで設定して表示)
(3) クリックで、カードの単語を表示できるようにする。
(4) javascriptでカードを配列化、単語の組み合わせを作成
(5) 2枚クリック時のOK/NG判定
(6) OK判定時の移動/NG判定時の元に戻す動作
(7) リセット押下時の、ランダム並べ替え動作
(8) ヒント押下時動作