本文へスキップ

パソコン初心者さんを対象にしたホームページです。パソコンで悩んでいることがあった時の手助けになれれば幸いです。

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

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

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

サンプルページを見る

手順

01. 雪を降らせる「javascript」を配布先からダウンロードするため、Snowstorm のホームページ(英語) サイトにアクセスします。

02.ダウンロードファイル

02. 「Download」項目にある
「Snowstorm v1.44.20131208」をクリックします。
(2016/12/1現在のバージョンです)

※分からない方は、「こちら」をクリックしてダウンロードし、フォルダーをデスクトップに保存して、「06.」へ進んでください。

03.名前をつけて保存

03.「名前を付けて保存」をクリックします。

04.デスクトップに保存 画像
04. 
(1) デスクトップに保存するので、デスクトップをクリックします。
(2) 「保存」をクリックします。
05.ダウンロード完了 画像

05. ダウンロードが完了したらすべて閉じておきます。

06.解凍

06. デスクトップに保存した「snowstormv144_20131208.zip」フォルダーをWクリックして圧縮されたものを解凍します。

07.解凍されたフォルダー

07. さらに「snowstormv144_20131208」フォルダーをWクリックして開きます。

08.ファイルをコピーする 画像

08. 「snowstorm.js」ファイルを選択し、コントロールキーを押したまま、Cキーを押してコピーします。

09.貼り付けた 画像

09. ホームページが保存しているフォルダーを開き、雪を降らせたいページのフォルダー内に貼り付けます。

10. 次に、テキストエディター(メモ帳、TeraPad、秀丸エディタ、など)や、ホームページビルダーを起動して、雪を降らせたいページ(indexファイルなど)を開きます。

全体のソース 画像

11. 下記のソースをドラッグし、コピーして、<head> ~ </head>の間に貼り付けます。

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

▼サンプルで使った全体のHTMLソース

12. これで完成です。雪が降るかどうか動作を確認してください。

バナースペース

相田みつを氏の詩集