miércoles, 9 de diciembre de 2015

Como Decorar Su Blog Para Navidad

Bueno primero que nada, les quiero dar algunos "consejos" de como decorar su blog, como yo lo hice, con un cursor navideño y copos de nieve cayendo *w*

Es algo sencillo, y es que varios tutos que vi no compatibles con algunas plantillas html de Blogger. Les dejo como le hice sho!!

Para poner los copos de Nieve

Van a diseño y agregar un Gadget y añaden un archivo HTML y ponen este código
<script type='text/javascript'>
var fallObjects=new Array();function newObject(url,height,width){fallObjects[fallObjects.length]=new Array(url,height,width);}

var numObjs=20, waft=50, fallSpeed=10, wind=0;
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhA1a9xbhz8nbhAdhCFklqIN1TkWHjly1CjQ0CmqJMDye1pSXbRzXuEzZr0fUb0TjhjZPWiBycbS7QGRVkob2hqs_VtDJUrB1YeuorV2-7jf5xhDyiJsfAOZuTRaaEyfNniudMr-JaQBO_R/s400/nieve2_jessi_diyva.png",22,22);
newObject("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhZx6Ejh_ZtMFFW2uGe6ZzIDQBrEtf3laXv2smRx767_TeDWFFg508hv5EKw61iY46i47p3_AdqA4enO5lbOE9CvF-uwD0F_ghLN5TcM_fcPt4z5BBJq94g2k2dN2ftHEskbK2A_WRC3tLp/s400/nieve1_jessi_diyva.png",22,22);

function winSize(){winWidth=(moz)?window.innerWidth-180:document.body.clientWidth-180;winHeight=(moz)?window.innerHeight+500:document.body.clientHeight+500;}
function winOfy(){winOffset=(moz)?window.pageYOffset:document.body.scrollTop;}
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:fixed;" 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);}
fall();
</script>
Le pueden poner cualquier figura mientras sea png reemplazando esto


Para poner el cursor de copo de nieve
Hacen exactamente lo mismo, van a diseño y agregan otro gadget de HTML y ponen este código
<style type="text/css">body, a, a:hover {cursor: url(http://cur.cursors-4u.net/nature/nat-4/nat394.cur), progress;}</style> 

Y listo, si quieren pueden buscar más cursores aquí

2 comentarios:

  1. Muy buen tutorial jamas habia visto que cayeran copos de nieve en un blog :)

    ResponderEliminar
    Respuestas
    1. Que bueno que te gustará! Y ni yo, solo que andando de vaga en el google me encontré con ese código y lo pobre c;

      Eliminar

Cursor

Grey Blinking Music Note

Colgantes