本文へスキップ

パソコンサポート

ポックルの部屋

ホーム  > ホームページ小技関連メニュー  > ホームページの任意のページに雪を降らせてみよう

ホームページの任意のページに雪を降らせてみよう

冬の季節になると雪が舞います。そこでホームページの画面に雪を降らせてみました。
※降る雪の画像が白いので、ページの背景色に注意してください。


サンプルページを見る


手順

  1. 雪を降らせる「javascript」を配布先からダウンロードするため、Snowstorm のホームページ(英語) サイトにアクセスします。
  2. 「Download」項目にある「Snowstorm v1.44.20131208」をクリックします。
    (2017/9/1現在のバージョンです)
    02.ダウンロードファイル

    ※探しても見つからない場合は、「こちら」をクリックしてダウンロードし、デスクトップに保存して、「手順 06. 」へ進んでください。
  3. 「名前を付けて保存」をクリックします。
    03.名前をつけて保存
  4. (1) デスクトップに保存するので、デスクトップをクリックします。
    (2)「保存」をクリックします。
    04.デスクトップに保存 画像
  5. ダウンロードが完了したらすべて閉じておきます。(下の画面はIEです)
    05.ダウンロード完了 画像
    w
  6. デスクトップに保存した「snowstormv144_20131208.zip」フォルダーをダブルクリックして圧縮されたものを解凍します。
    06.解凍
  7. さらに「snowstormv144_20131208」フォルダーをダブルクリックして開きます。
    07.解凍されたフォルダー
  8. 「snowstorm.js」ファイルを選択し、(コントロール)キーを押したまま、 キーを押してコピーします。
    08.ファイルをコピーする 画像
  9. ホームページが保存しているフォルダーを開き、雪を降らせたいページのフォルダー内に貼り付けます。
    09.貼り付けた 画像
  10. 次に、テキストエディター(メモ帳、TeraPad、秀丸エディタ、など)や、ホームページビルダーを起動して、雪を降らせたいページ(indexファイルなど)を開いておきます。
  11. 下記のソースをドラッグし、コピーして、<head> ~ </head> の間に貼り付けます。

    <script src="snowstorm.js" type="text/javascript" language="JavaScript"></script>

    ▼貼り付けたページ
    全体のソース 画像
  12. これで完成です。雪が降るかどうか動作を確認してください。

広告バナー

レンタルサーバー・ロリポップ

さくらレンタルサーバー