NOVEDADES

27 octubre 2017

Decora tu blog para Halloween con criaturas monstruosas en movimiento

Decoración Halloween Blogger

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.

Decora tu blog para Halloween con criaturas monstruosas en movimiento

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://1.bp.blogspot.com/-MqrlVxhKj7w/WfN3tkfW9DI/AAAAAAAAhic/LQTQW7VBt4I8DnP5RWUqdAG1PgLQehsfQCEwYBhgL/s1600/Criaturas%2Binfernales%252C%2BPNG%252C%2Bkiketrucker%2B%252813%2529.png",27,23);
newObject("https://3.bp.blogspot.com/-aynRnbX26PI/WfN6LpbcD4I/AAAAAAAAhis/winsIJc7fwEzYCJ01NkmG_ES_rnji8BAwCLcBGAs/s1600/Criaturas%2Binfernales%252C%2BPNG%252C%2Bkiketrucker%2B%252814%2529.png",46,15);
newObject("https://2.bp.blogspot.com/-pmQpJRr-PwQ/WfN6XgiLZxI/AAAAAAAAhiw/S6PQjqtz6XgkHkm5IBLPHuV8nhpMubSnACLcBGAs/s1600/Criaturas%2Binfernales%252C%2BPNG%252C%2Bkiketrucker%2B%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 hojas 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.

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

Si te ha gustado el post comparte en tus redes sociales:

Publicar un comentario

Anímate a dejar un comentario, es la mejor manera de interactuar y ayudarnos a mantener el blog actualizado.

 
Copyright © 2014 AccionglobalXSoft. Designed by OddThemes