■
背景に雪(画像)を降らせよう
■
ソースbは、<head> 〜 </head> の間に記述してね。
■
ソースa
■
<body>タグのところに、 onload="init();" と追加して下さい
<body
onload="init();"
>
雪の画像DL
DownLoad
■
ソースb
■
<SCRIPT language="JavaScript"> <!-- var num = 8; //画像の数 var speed = 80; //画像の動くスピード var obj_img = "ball1.gif"; //画像の指定 var ns4 = (document.layers) ? 1 : 0; var ie4 = (document.all) ? 1 : 0; var DOM = (document.getElementById) ? 1 : 0; var i; var doc_width = 800; var doc_height = 600; var dx = new Array(num); var xp = new Array(num);//画像のポジション var yp = new Array(num); var am = new Array(num); //振動 var stx = new Array(num); //動きのステップ var sty = new Array(num); function init(){ if(DOM || ie4){ doc_width = (ie4) ? document.body.clientWidth : window.innerWidth; doc_height = (ie4) ? document.body.clientHeight : window.innerHeight; }else if(ns4) { doc_width = window.innerWidth; doc_height = window.innerHeight; } if(DOM){ Anim_DOM(); }else if(ns4){ Anim_NS(); }else if(ie4){ Anim_IE(); } } for (i = 0; i < num; ++i) { dx[i] = 0; //同調させるため xp[i] = Math.random() * (doc_width-50); //ポジション yp[i] = Math.random() * doc_height; am[i] = Math.random() * 20; //振動 stx[i] = 0.02 + Math.random()/10; //X軸のステップ sty[i] = 0.7 + Math.random(); //Y軸のステップ if(DOM || ie4){ document.write("<div id=\"bubl"+ i +"\" style=\"POSITION: absolute; Z-INDEX: " + i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\">"); document.write("<img src=\"" + obj_img + "\" border=\"0\"></div>"); }else if(ns4) { document.write("<layer name=\"bubl"+ i +"\" left=\"15\" top=\"15\" visibility=\"show\">"); document.write("<img src=\"" + obj_img + "\" border=\"0\"></layer>"); } } function Anim_DOM() { //DOMのアニメーション var obj_bubl; for(i = 0; i < num; ++i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height + 50) { xp[i] = Math.random() * (doc_width - am[i] - 30); yp[i] = 50; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = (ie4) ? document.body.clientWidth : window.innerWidth; doc_height = (ie4) ? document.body.clientHeight : window.innerHeight; } dx[i] += stx[i]; obj_bubl = document.getElementById("bubl"+i).style; obj_bubl.top = yp[i] + "px"; obj_bubl.left = (xp[i] + am[i] * Math.sin(dx[i])) + "px"; } setTimeout("Anim_DOM()", speed); } function Anim_NS() { //Netscapeのアニメーション var obj_bubl; for(i = 0; i < num; ++i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height + 50) { xp[i] = Math.random() * (doc_width - am[i] - 30); yp[i] = 50; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = window.innerWidth; doc_height = window.innerHeight; } dx[i] += stx[i]; obj_bubl = document.layers["bubl"+i]; obj_bubl.top = yp[i]; obj_bubl.left = xp[i] + am[i] * Math.sin(dx[i]); } setTimeout("Anim_NS()", speed); } function Anim_IE() { //IEのアニメーション var obj_bubl; for(i = 0; i < num; ++i) { // iterate for every dot yp[i] += sty[i]; if (yp[i] > doc_height + 50) { xp[i] = Math.random() * (doc_width - am[i] - 30); yp[i] = 50; stx[i] = 0.02 + Math.random()/10; sty[i] = 0.7 + Math.random(); doc_width = document.body.clientWidth; doc_height = document.body.clientHeight; } dx[i] += stx[i]; obj_bubl = document.all["bubl"+i].style; obj_bubl.top = yp[i]; obj_bubl.left = xp[i] + am[i] * Math.sin(dx[i]); } setTimeout("Anim_IE()", speed); } --> </SCRIPT>