Hojas de otoño cayendo en el blog

 

Para los que vivimos en el hemisferio norte ya es otoño desde hace algunos días, y algunos me han preguntado por algún truquillo que haga caer hojas en el blog. Este script de MaxxBlade que aunque originalmente tiene otro fin, puede usarse para hacer que caigan imágenes de hojas en el blog, sin embargo, aunque en todos los navegadores que probé funcionó bien, es posible que en Internet Explorer no funcione, pero eso ya no nos extraña ¿verdad?

Un ejemplo se puede ver en este blog de pruebas.

http://emoticons-blogger.blogspot.com/p/otono.html

Para poner estas hojas cayendo en el blog entra en la Edición HTML de la plantilla y antes de </head> pega lo siguiente:

<script>
//<![CDATA[
// Fall v2.0 By MaxxBlade - http://www.maxxblade.co.uk/fall
var fallObjects=new Array();function newObject(url,height,width){fallObjects[fallObjects.length]=new Array(url,height,width);}
var numObjs=15, waft=100, fallSpeed=5, wind=-1;

newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgpkLCVrbC5cyICjq7kSdM0TBDNLrF6HXYlFNPWK9isyFLgQHdqBgODY4hpFgkEBFN_a53xivJOQfWBzbyDKPNez5f6JRbCtKLtwUD9_4lgCjzxTJv6hL0sJH6P-1qy6I44Xo5sdwUVIho/s100/hoja1.png",29,15);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiso8_y7b5fGy1z8u_SNxBFBaxDiAVw-YRpqFF00oI5cVH2ObbkJSfwrYVPr4DloUBsBQat0jUryV8NrLW-Ihdbnaz0gB5fUNvGGlwoliKDKdSd6IjOa8FuTcT_tsxtJYUpr-jD98e1-uU/s100/hoja2.png",27,23);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhfhQBtCeac7Wpe7oGFMyFhZLRO3Ggq4r0Dnoela3BDZlQBXeQJh4up86VqLSebjXRS_73-mXZZdxetxDiRCv3E-swMXOQiBWG5-vO1opWEAH1P6Pme-KU_BqG0IebE4eVW86ia6bkSqrI/s100/hoja3.png",46,15);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjjQTqnMYmbRGxy2w2l-6m9yU2UP_ex9SdenmMT5lWDB1_nWyqUqYa6zoyVlXH1v-KVo4EUpXiz6sQAMZxr7chygjfQKOKFtkeXgipaiA_WRhw__T6Rbc1ng3U_gOsDVVzUKPrCLF9Zias/s100/hoja4.png",36,33);
function winSize(){winWidth=(moz)?window.innerWidth:document.body.clientWidth;winHeight=(moz)?window.innerHeight:document.body.clientHeight;}
function fallObject(num,vari,nu){
objects[num]=new Array(parseInt(Math.random()*(winWidth-waft)),-30,(parseInt(Math.random()*waft))*((Math.random()>0.5)?1:-1),0.02+Math.random()/20,0,1+parseInt(Math.random()*fallSpeed),vari,fallObjects[vari][1],fallObjects[vari][2]);
if(nu==1){document.write('<img id="fO'+i+'" style="position:absolute;z-index:9;background:none;border:0;padding:0;box-shadow:none;" src="'+fallObjects[vari][0]+'">'); }
}
function fall(){
for(i=0;i<numObjs;i++){
var fallingObject=document.getElementById('fO'+i);
if((objects[i][1]>(winHeight-(objects[i][5]+objects[i][7])))||(objects[i][0]>(winWidth-(objects[i][2]+objects[i][8])))){fallObject(i,objects[i][6],0);}
objects[i][0]+=wind;objects[i][1]+=objects[i][5];objects[i][4]+=objects[i][3];
with(fallingObject.style){ top=objects[i][1]+winOffset+"px";left=objects[i][0]+(objects[i][2]*Math.cos(objects[i][4]))+"px";}
}
setTimeout("fall()",31);
}
var objects=new Array(),winOffset=0,winHeight,winWidth,togvis,moz=(document.getElementById&&!document.all)?1:0;winSize();
for (i=0;i<numObjs;i++){fallObject(i,parseInt(Math.random()*fallObjects.length),1);}
window.onresize=winSize;fall();
//]]>
</script>

En la parte marcada con color amarillo verás unas opciones:
var numObjs=15, es la cantidad de hojas que aparecerán.
waft=100, es qué tantos pixeles se mueven a los lados cuando caen
fallSpeed=5, es la velocidad, y
wind=-1; es la dirección del viento, puede ser un valor negativo como está, 0 para que no tengan dirección, o un valor positivo (por ejemplo 1). Si es un valor negativo caerán a la izquierda, si es un valor positivo caerán a la derecha.

Con tan sólo eso tu blog tendrá una decoración muy acorde a esta temporada.

Autor | MaxxBlade

CREDITOS

http://www.ciudadblogger.com/2012/09/hojas-de-otono-cayendo-en-el-blog.html