janken1st (パンダゲーム)

DEMO

https://guolam.github.io/janken1st/coverpage.html

紹介と使い方

• 設定：パンダが森に迷子になってます。森から脱出するために、「食べる」と「進む」しか選べない。

• パンダの初期HPは５しかありません。

• 選択肢： 1.「食べる」：食べ物によって、HPが増やしたり、減ったりする、 運が悪ければ、クマに襲われて、一発で死ぬ。

2. 「進む」：確実にHP-1

• 運が良ければ森から脱出；悪ければ死ぬ運命に...

• 基本原理：

1. javascriptのMath randomでランダムに食べ物を入れて、点数を決める。 完全なる運ゲーです。

2. if関数により、点数が０になった時点でゲーオーバー

工夫した点

• テキストを基本画像にすること

• 子供でもすぐわかるような操作

• アイコンを全て同じスタイルに揃う

苦戦した点

• 最初から苦戦していました。

• java scriptの原理を理解できなくて、応用が効かなかったのに、4日くらいかかりました。

• 1. 画像を.html .attrで入れ替えようとして、うまくいかず、、、
• 2. ゲームオーバー設定できず

• 3.着地点と目的が見えず、逆算できなかったのが良くなかった、最終形態を考えてから着手すべきでした。

• 4. エラー連発で、なぜかコードは動いた。その原因がわからないまま進みまして、最終的に判定設定に響いた。コードを一回見直して、全てが綺麗に動きました。

参考にした web サイトなど

• Array https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array

ー GIFアニメーションがリロードの際に動かない問題と解決方法 https://blanche-toile.com/web/jquery-gifanimation-load-web-caching

-JavaScriptで音楽再生する方法をサンプルコード付き解説！

https://qumeru.com/magazine/376