»
EnglishFrenchVietnamese

Print - Rain/Snow effect without images - JavaScriptBank.com

Full version: jsB@nk » Multimedia » Events » Rain/Snow effect without images
URL: https://www.javascriptbank.com/rain-snow-effect-without-images.html

Rain/Snow effect without images © JavaScriptBank.comThis is simply one of the most efficient, elegant rain/snow effects we've seen. Created without the aid of images, it's also hassle-free to install. Toggle between rain and snow effect with the change of one variable.

Full version: jsB@nk » Multimedia » Events » Rain/Snow effect without images
URL: https://www.javascriptbank.com/rain-snow-effect-without-images.html



CSS
<style>.drop { position: absolute; width: 3;  filter: flipV(), flipH(); font-size: 20; color: red }</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script language="javascript">//Rain/Snow effect- By Craig Blanchette Craiga.topcities.com//Script featured on Dynamic Drive//Visit http://www.dynamicdrive.com for this script and moresnow = false;    // false-rain;   true-snowsnowsym = " * "  //These are the symbols for eachrainsym = " ' "  //You can put images here.howmany = 20     //How many drops/snowflakes?/**************Do not need to change anything below***********/if(snow){sym = snowsym; speed=1; angle=10; drops=howmany}else{sym = rainsym; speed=50; drops=howmany; angle=6}movex = -speed/angle; movey = speed; count = 0;function moverain(){for(move = 0; move < drops; move++){xx[move]+=movex;  yy[move]+=mv[move];hmm = Math.round(Math.random()*1);if(xx[move] < 0){xx[move] = maxx+10;}if(yy[move] > maxy){yy[move] = 10;}drop[move].left = xx[move]drop[move].top = yy[move]+document.body.scrollTop;}setTimeout('moverain()','1')}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<script language="javascript">if (document.all){drop = new Array(); xx = new Array(); yy = new Array(); mv = new Array()ly = "document.all[\'"; st = "\'].style"for(make = 0; make < drops; make++){document.write('<div id="drop'+make+'" class=drop>'+sym+'</div>');drop[make] = eval(ly+'drop'+make+st);maxx = document.body.clientWidth-40maxy = document.body.clientHeight-40xx[make] = Math.random()*maxx;yy[make] = -100-Math.random()*maxy;drop[make].left = xx[make]drop[make].top = yy[make]mv[make] = (Math.random()*5)+speed/4;drop[make].fontSize = (Math.random()*10)+20;if(snow){col = 'white'}else{col = 'blue'}drop[make].color = col;}window.onload=moverain}</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->