複数種類の画像の花が降るJavaScriptです。
流れる画像のサイズをJavaScriptのソースの中で個別に指定できます。
実寸が同じような大きさの画像の場合、サイズ指定を変化させることで、大小の画像を降らせることができます。
文章の上に画像が散るか、文章の下に隠れるか（←この見本では隠れる）の指定も選択できます。
原本の作者はアルバム作成のフリーソフト『すなねぃる』の方。
原本の降る画像は１種類です。原本はこちらから。
■降る画像が実寸サイズのJavaScriptはこちら → 降る上る５■画像D■複数画像の花が散る -sna WORLD-
ご質問があったので、別ディレクトリにある画像のファイル指定の方法を説明します。
基本として、
var ha=new Array();
ha[0]="sa2.png";
ha[1]="sa2.png";
ha[2]="sa4.png";
を簡略化した指定方法が、下記になります。上も下も同じ意味です。
var ha=["sa2.png","sa2.png","sa4.png"];
１．画像が同じディレクトリの「image」というフォルダーに入っている場合は
var ha=["image/sa2.png","image/sa2.png","image/sa4.png"];
２．その「image」フォルダーが、一つ上のディレクトリにある場合は
var ha=["../image/sa2.png","../image/sa2.png","../image/sa4.png"];と指定します。
今回は、別ディレクトリにある画像を指定しやすいように
「var myurl=""; //★画像パス。文書とは別のフォルダーなどに入っている時は指定。全画像共通部分」を付けました。
３．これを使って指定する場合、２のパターンでは
var ha=["sa2.png","sa2.png","sa4.png"];
var myurl="../image/";
と指定することもできます。
４．ディレクトリの位置がよく把握できない場合は絶対位置指定で指定することもできます。
２のパターンで指定する場合は、
var ha=["http://oekakirenn.webcrow.jp/image/sa2.png","http://oekakirenn.webcrow.jp/image/sa2.png","http://oekakirenn.webcrow.jp/image/sa4.png"];
３のパターンで指定する場合は、
var ha=["sa2.png","sa2.png","sa4.png"];
var myurl="http://oekakirenn.webcrow.jp/image/";
という指定方法になります。
なお、１や２のパターンで記述した場合は、「myurl」には何も記述せず、「var myurl="";」のままにして下さい。
ここにも「var myurl="../image/";」を記述したり、「var myurl="";」を削除したりするとエラーになります。
「var myurl="../image/";」を記述するのは、画像が別フォルダに入っているのに「var ha=[〜〜]」のところに「"sa2.png"」等の画像名のみを記述した場合だけです。
 sa2.png |
 sa4.png |
私の作成した 背景透過png。 右クリックで どうぞ。 |