Decora tu blog para Halloween con criaturas monstruosas en movimiento

Información

Llega Halloween y es hora de decorar nuestros blogs para el día de los muertos. si quieres que varios monstruos deambulen por  tu blog sigue estos sencillos pasos.

Entra en el panel de configuración de tu blog y en la parte izquierda clica en Tema y después en Edición HTML.

Una vez allí antes de  </head> pega el siguiente código y dale a Guardar tema.

---

<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/AVvXsEibc4eOFKhtuyT9qBlVKGMoMovtIrlJ0IQ3eclonesUEApjO5tEsKc892v702PIkeIFBzBrI_WYAAybnqz7DWRZZFkBXxDqIL_g76aBit49HrX5jpfHvuACjxGxDnhWr209GFpT9oECnyo/s1600/Criaturas+infernales%252C+PNG%252C+kiketrucker+%252813%2529.png",27,23);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhIf69sSg1HgjP_nxhDiPRx01LfH4Zukl2Qp5fl8OaqG5cvAc2hLPj8A655lbhHjeanRTmb3xKsf62iUho_3ai6GQg093ft4ubc4cCIgL699UIqq8rNZwjYE-ZtZA2wdojJIQoPnlK4a-Y/s1600/Criaturas+infernales%252C+PNG%252C+kiketrucker+%252814%2529.png",46,15);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEeXx3dvcs-HcMPTpKn6Ggj2E3FSb7pwQOzhaSIpRjkpuJ3Pe2J2Z40qdVeYbu282oq2EcK_D9y4cYnIl1vVr9qIAb6OH2ztBMy6YtT4gELD-tDC8Va9nyF5zJkb-taWq9BZhnNd8Hudg/s1600/Criaturas+infernales%252C+PNG%252C+kiketrucker+%25282%2529.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 azul verás unas opciones: 

var numObjs=15, es la cantidad de elementos que aparecerán. 

waft=100, es la cantidad de pixeles que se mueven a los lados cuando caen 

fallSpeed=5, es la velocidad

wind=-1; es la dirección en la que caen los elementos, 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. 

Cada linea como la resaltada en rojo es un elemento, si quieres personalizarlos sólo tienes que cambiar la url de dicho elemento.

 

Un pequeño consejo, para subir la imagen a nuestro blog, crearemos una entrada que llamaremos Imágenes del blog, y allí subiremos la imagen que queramos usar, después daremos a vista en HTML para copiar la URL de dicha imagen, ya sólo nos queda guardar esa entrada como borrador, y siempre que necesitemos agregar una imagen para usar su URL acudiremos a esta entrada en borrador.

Si queréis añadir o cambiar las imágenes en el siguiente post del blog tenéis varias para elegir:

Criaturas infernales PNG