タイトル画面作成②

あけましておめでとうございます。東京経済大学のおみぬーです。
前回に引き続きタイトル画面作成の詳細になります。今回はマップのHTMLファイルからタイトルのHTMLファイルに遷移するためのコードの紹介をします。

タイトル画面のHTMLファイルに遷移するためのreturntitlepaint関数を定義しました。コードの詳細は以下になります。

function returntitlepaint(){
location.href = "kenkyunotetitle.html";
}

前回同様、location.href関数を使用してタイトル画面のHTMLファイル、"kenkyunotetitle.html"に遷移するように定義しています。
returntitlepaint関数を呼び出すタイミングは、各エンド到達時のEND画面です。既存のfendingpaintとbadendpaintの二つ(以降まとめてendingpaintとします)に以下のコードを追加しました。

buttonok.style.display = "";
buttonok.style.position = "absolute";
buttonok.style.left = "500px";
buttonok.style.top = "330px";
buttonok.style.width = "100px";
buttonok.style.height = "50px";
buttonok.onclick = function(){returntitlepaint(); buttonok.style.display = "none";}

上部6行でOKボタンを表示させるためのコードを定義し、7行目のbuttonok.onclickでOKボタンをクリックすることでreturntitlepaintを呼び出し、 buttonok.style.display = "none"でOKボタンを非表示にしています。以下が表示される画面です。



右下のOKボタンをクリックすることで、タイトル画面に遷移します。
またこのブログ作成と並行して、マップやキャラクターのイラストを自作しました。次回はイラストを紹介しようと思います。

新規のコードはこれ以上しようする予定はありません。そのため、コードの詳細な説明は今回で最後にしようと考えています。(場合によっては記載する可能性あり)
今後は詳細は省きますが、表示される画面などの大まかな説明と画像のみになると思います。最後までお付き合いいただけると幸いです。


参考文献
田中賢一郎『ゲームで学ぶJavaScript 入門』インプレス,2015年
田中賢一郎『ゲームで作りながら楽しく学べる HTML5+CSS+JavaScript』インプレス,2017年
田中賢一郎『ゲームで学ぶJavaScript 入門 増補改訂版~ブラウザゲームづくりでHTML&CSSも身につく!』インプレス,2022年

人気の投稿