Efeito de neve no Blogger

Copie e coloque no seu blog pela pagina layout, adicionar gadget, html/javascript. Este gadget pode ficar em qualquer parte da sua pagina. Você pode usar com a imagem que desejar, ou seja, não é necessário utilizars somente com imagens que simulem neve poderiam ser corações caindo pelo blog ou qualquer outra imagem, você só precisa hospedar a imagem e colocar no lugar indicado no código. Abaixo temos 4 imagens que podem servir como neve para utilizar alguma delas sugerimos salvar, depois hospedar no seu servidor e colocar o endereço da imagem no código no lugar que está http://img42.imageshack.us/img42/5508/neve1.png.

Não elaboramos o código já com o endereço de cada imagem, pois se muitas pessoas usarem a mesma imagem isso pode fazer com que ela seja removida do site de hospedagem por se tratar de um serviço grátis. Espero que esse código seja útil para enfeitar o seu blog .

Quando visualizar seu blog pode ter a impressão que os flocos de neve passam apenas uma vez, mas não é isso que acontece, na verdade eles percorrem a pagina inteira até o final e não somente a parte que aparece na tela, então depois de aparecer a primeira vez os flocos demoram alguns segundos para começar novamente, mas isso é normal, veja que após ficar na pagina alguns segundos o efeito fica muito melhor que no inicio por justamente se tratar de um script.
Para utilizar esse código com os novos modelos de template do blogger(designer do modelo) você deve colocar o código na pagina editar html, logo após a linha que abre o body, (sugerimos esta forma pela segurança):
<body expr:class='"loading" + data:blog.mobileClass'>
Talvez no seu html não seja examente igual mas o importante é <body ......>, então logo abaixo desta linha cole o código que citamos no inicio deste tutorial.

Instalar o efeito de neve no seu blogue é muito simples.

1º - Entre no seu Blogue e Clique em Design;
2º - No separador Elementos de Página clique em adicionar um widget;
3º - Só precisa copiar um dos códigos javascripts que estão em baixo;
4º - Clique em Salvar e Pronto!

Código 1

Código 2

Código 3

Código 4

Código 5

Código 6

<br /> <script type="text/javascript"> if  ((document.getElementById) &&  window.addEventListener || window.attachEvent){ (function(){ //Configure here. var num = 60;   //Numero de flocos var timer = 15; //setTimeout speed. Varies on different comps var enableinNS6 = 1 //Enable script in NS6/Mozilla? Snow animation could be slow in those browsers. (1=yes, 0=no). //End. var y = []; var x = []; var fall = []; var theFlakes = []; var sfs = []; var step = []; var currStep = []; var h,w,r; var d = document; var pix = "px"; var domWw = (typeof window.innerWidth == "number"); var domSy = (typeof window.pageYOffset == "number"); var idx = d.getElementsByTagName('div').length; if (d.documentElement.style &&  typeof d.documentElement.style.MozOpacity == "string") num = 12; for (i = 0; i < num; i++){ sfs[i] = Math.round(1 + Math.random() * 1); document.write('<div id="flake'+(idx+i)+'" style="position:absolute;top:0px;left:0px;width:' +sfs[i]+'px;height:'+sfs[i]+'px;background-color:#ffffff;font-size:'+sfs[i]+'px"><\/div>'); currStep[i] = 0; fall[i] = (sfs[i] == 1)? Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2); step[i] = (sfs[i] == 1)? 0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ; } if (domWw) r = window; else{    if (d.documentElement &&    typeof d.documentElement.clientWidth == "number" &&    d.documentElement.clientWidth != 0)   r = d.documentElement;  else{    if (d.body &&    typeof d.body.clientWidth == "number")   r = d.body;  } } function winsize(){ var oh,sy,ow,sx,rh,rw; if (domWw){   if (d.documentElement && d.defaultView &&    typeof d.defaultView.scrollMaxY == "number"){   oh = d.documentElement.offsetHeight;   sy = d.defaultView.scrollMaxY;   ow = d.documentElement.offsetWidth;   sx = d.defaultView.scrollMaxX;   rh = oh-sy;   rw = ow-sx;  }  else{   rh = r.innerHeight;   rw = r.innerWidth;  } h = rh - 2;   w = rw - 2;  } else{ h = r.clientHeight - 2;  w = r.clientWidth - 2;  } } function scrl(yx){ var y,x; if (domSy){  y = r.pageYOffset;  x = r.pageXOffset;  } else{  y = r.scrollTop;  x = r.scrollLeft;  } return (yx == 0)?y:x; } function snow(){ var dy,dx; for (i = 0; i < num; i++){  dy = fall[i];  dx = fall[i] * Math.cos(currStep[i]);  y[i]+=dy;  x[i]+=dx;  if (x[i] >= w || y[i] >= h){   y[i] = -10;   x[i] = Math.round(Math.random() * w);   fall[i] = (sfs[i] == 1)?   Math.round(2 + Math.random() * 2): Math.round(3 + Math.random() * 2);   step[i] = (sfs[i] == 1)?   0.05 + Math.random() * 0.1 : 0.05 + Math.random() * 0.05 ;  }  theFlakes[i].top = y[i] + scrl(0) + pix;  theFlakes[i].left = x[i] + scrl(1) + pix;  currStep[i]+=step[i]; } setTimeout(snow,timer); } function init(){ winsize(); for (i = 0; i < num; i++){  theFlakes[i] = document.getElementById("flake"+(idx+i)).style;  y[i] = Math.round(Math.random()*h);  x[i] = Math.round(Math.random()*w); } snow(); } if (window.addEventListener){  window.addEventListener("resize",winsize,false);  window.addEventListener("load",init,false); }   else if (window.attachEvent){  window.attachEvent("onresize",winsize);  window.attachEvent("onload",init); }  })(); }//End. </script>

Se você não gostar do efeito de neve que escolheu, pode escolher outro código acima e repetir o processo. ;)

Visualize e se der certo salve as alterações, der algum erro, limpe as alterações e refaça o processo.

Efeito de neve no Blogger

Administrador

0 comentários

Masign Clean

Efeito de neve no Blogger

Administrador 

comment 0 comentários

Administrador

0 comentários