こんにちは、プログラマーの山本です。
今回は企業さんからのご依頼で、
・WEBサイトの上から指定の画像10枚をランダムに降らし、
その画像をクリックした時に画像を削除する。
・さらに画像クリック時に、ランダムに5種類の音を鳴らす。
というシステムを制作しました。
同じようなシステムを開発したい方は参考にしてください。
コピペで同じシステムを導入できるようにしておきます。
画像の準備
今回は10枚の画像を用意しました。
扱いやすくするため、名前は「1.png」〜「10.png」にして、
全て同じディレクトリに入れます。
降らす画像の指定に、この番号を使用します。
【HTML】再生する音声のリストを書く。
htmlで音声を設置しておきます。
url.mp3 のところは、各音声のURLに変更しましょう。
【JavaScript】画像を降らせるシステムのコードを書く。
jQueryを使うので、jQueryファイルを読み込んでおきます。