Para fazer o efeito neve no seu blog entre na pagina layout > adicionar gadget > html/javascript e cole esse código:
<script>/** @license DHTML Snowstorm! JavaScript-based Snow for web pages
--------------------------------------------------------
Version 1.43.20111201 (Previous rev: 1.42.20111120)
Copyright (c) 2007, Scott Schiller. All rights reserved.
Code provided under the BSD License:
http://schillmania.com/projects/snowstorm/license.txt
*/
var snowStorm=function(e,d){function g(a,d){isNaN(d)&&(d=0);return Math.random()*a+d}function o(){e.setTimeout(function(){a.start(true)},20);a.events.remove(i?d:e,"mousemove",o)}function r(){if(!a.excludeMobile||!s)a.freezeOnBlur?a.events.add(i?d:e,"mousemove",o):o();a.events.remove(e,"load",r)}this.autoStart=true;this.flakesMax=128;this.flakesMaxActive=64;this.animationInterval=33;this.excludeMobile=true;this.flakeBottom=null;this.followMouse=true;this.snowColor="#fff";this.snowCharacter="•";
this.snowStick=true;this.targetElement=null;this.useMeltEffect=true;this.usePositionFixed=this.useTwinkleEffect=false;this.freezeOnBlur=true;this.flakeRightOffset=this.flakeLeftOffset=0;this.flakeHeight=this.flakeWidth=8;this.vMaxX=5;this.vMaxY=4;this.zIndex=0;var a=this,y=this,i=navigator.userAgent.match(/msie/i),z=navigator.userAgent.match(/msie 6/i),A=navigator.appVersion.match(/windows 98/i),s=navigator.userAgent.match(/mobile|opera m(ob|in)/i),B=i&&d.compatMode==="BackCompat",t=s||B||z,h=null,
k=null,j=null,m=null,u=null,v=null,p=1,n=false,q;a:{try{d.createElement("div").style.opacity="0.5"}catch(C){q=false;break a}q=true}var w=false,x=d.createDocumentFragment();this.timers=[];this.flakes=[];this.active=this.disabled=false;this.meltFrameCount=20;this.meltFrames=[];this.events=function(){function a(b){var b=f.call(b),c=b.length;l?(b[1]="on"+b[1],c>3&&b.pop()):c===3&&b.push(false);return b}function d(a,c){var e=a.shift(),f=[b[c]];if(l)e[f](a[0],a[1]);else e[f].apply(e,a)}var l=!e.addEventListener&&
e.attachEvent,f=Array.prototype.slice,b={add:l?"attachEvent":"addEventListener",remove:l?"detachEvent":"removeEventListener"};return{add:function(){d(a(arguments),"add")},remove:function(){d(a(arguments),"remove")}}}();this.randomizeWind=function(){var c;c=g(a.vMaxX,0.2);u=parseInt(g(2),10)===1?c*-1:c;v=g(a.vMaxY,0.2);if(this.flakes)for(c=0;c<this.flakes.length;c++)this.flakes[c].active&&this.flakes[c].setVelocities()};this.scrollHandler=function(){var c;m=a.flakeBottom?0:parseInt(e.scrollY||d.documentElement.scrollTop||
d.body.scrollTop,10);isNaN(m)&&(m=0);if(!n&&!a.flakeBottom&&a.flakes)for(c=a.flakes.length;c--;)a.flakes[c].active===0&&a.flakes[c].stick()};this.resizeHandler=function(){e.innerWidth||e.innerHeight?(h=e.innerWidth-16-a.flakeRightOffset,j=a.flakeBottom?a.flakeBottom:e.innerHeight):(h=(d.documentElement.clientWidth||d.body.clientWidth||d.body.scrollWidth)-(!i?8:0)-a.flakeRightOffset,j=a.flakeBottom?a.flakeBottom:d.documentElement.clientHeight||d.body.clientHeight||d.body.scrollHeight);k=parseInt(h/
2,10)};this.resizeHandlerAlt=function(){h=a.targetElement.offsetLeft+a.targetElement.offsetWidth-a.flakeRightOffset;j=a.flakeBottom?a.flakeBottom:a.targetElement.offsetTop+a.targetElement.offsetHeight;k=parseInt(h/2,10)};this.freeze=function(){var c;if(a.disabled)return false;else a.disabled=1;for(c=a.timers.length;c--;)clearInterval(a.timers[c])};this.resume=function(){if(a.disabled)a.disabled=0;else return false;a.timerInit()};this.toggleSnow=function(){a.flakes.length?(a.active=!a.active,a.active?
(a.show(),a.resume()):(a.stop(),a.freeze())):a.start()};this.stop=function(){var c;this.freeze();for(c=this.flakes.length;c--;)this.flakes[c].o.style.display="none";a.events.remove(e,"scroll",a.scrollHandler);a.events.remove(e,"resize",a.resizeHandler);a.freezeOnBlur&&(i?(a.events.remove(d,"focusout",a.freeze),a.events.remove(d,"focusin",a.resume)):(a.events.remove(e,"blur",a.freeze),a.events.remove(e,"focus",a.resume)))};this.show=function(){var a;for(a=this.flakes.length;a--;)this.flakes[a].o.style.display=
"block"};this.SnowFlake=function(a,e,l,f){var b=this;this.type=e;this.x=l||parseInt(g(h-20),10);this.y=!isNaN(f)?f:-g(j)-12;this.vY=this.vX=null;this.vAmpTypes=[1,1.2,1.4,1.6,1.8];this.vAmp=this.vAmpTypes[this.type];this.melting=false;this.meltFrameCount=a.meltFrameCount;this.meltFrames=a.meltFrames;this.twinkleFrame=this.meltFrame=0;this.active=1;this.fontSize=10+this.type/5*10;this.o=d.createElement("div");this.o.innerHTML=a.snowCharacter;this.o.style.color=a.snowColor;this.o.style.position=n?"fixed":
"absolute";this.o.style.width=a.flakeWidth+"px";this.o.style.height=a.flakeHeight+"px";this.o.style.fontFamily="arial,verdana";this.o.style.cursor="default";this.o.style.overflow="hidden";this.o.style.fontWeight="normal";this.o.style.zIndex=a.zIndex;x.appendChild(this.o);this.refresh=function(){if(isNaN(b.x)||isNaN(b.y))return false;b.o.style.left=b.x+"px";b.o.style.top=b.y+"px"};this.stick=function(){t||a.targetElement!==d.documentElement&&a.targetElement!==d.body?b.o.style.top=j+m-a.flakeHeight+
"px":a.flakeBottom?b.o.style.top=a.flakeBottom+"px":(b.o.style.display="none",b.o.style.top="auto",b.o.style.bottom="0px",b.o.style.position="fixed",b.o.style.display="block")};this.vCheck=function(){if(b.vX>=0&&b.vX<0.2)b.vX=0.2;else if(b.vX<0&&b.vX>-0.2)b.vX=-0.2;if(b.vY>=0&&b.vY<0.2)b.vY=0.2};this.move=function(){var d=b.vX*p;b.x+=d;b.y+=b.vY*b.vAmp;if(b.x>=h||h-b.x<a.flakeWidth)b.x=0;else if(d<0&&b.x-a.flakeLeftOffset<-a.flakeWidth)b.x=h-a.flakeWidth-1;b.refresh();if(j+m-b.y<a.flakeHeight)b.active=
0,a.snowStick?b.stick():b.recycle();else{if(a.useMeltEffect&&b.active&&b.type<3&&!b.melting&&Math.random()>0.998)b.melting=true,b.melt();if(a.useTwinkleEffect)if(b.twinkleFrame)b.twinkleFrame--,b.o.style.visibility=b.twinkleFrame&&b.twinkleFrame%2===0?"hidden":"visible";else if(Math.random()>0.9)b.twinkleFrame=parseInt(Math.random()*20,10)}};this.animate=function(){b.move()};this.setVelocities=function(){b.vX=u+g(a.vMaxX*0.12,0.1);b.vY=v+g(a.vMaxY*0.12,0.1)};this.setOpacity=function(a,b){if(!q)return false;
a.style.opacity=b};this.melt=function(){!a.useMeltEffect||!b.melting?b.recycle():b.meltFrame<b.meltFrameCount?(b.setOpacity(b.o,b.meltFrames[b.meltFrame]),b.o.style.fontSize=b.fontSize-b.fontSize*(b.meltFrame/b.meltFrameCount)+"px",b.o.style.lineHeight=a.flakeHeight+2+a.flakeHeight*0.75*(b.meltFrame/b.meltFrameCount)+"px",b.meltFrame++):b.recycle()};this.recycle=function(){b.o.style.display="none";b.o.style.position=n?"fixed":"absolute";b.o.style.bottom="auto";b.setVelocities();b.vCheck();b.meltFrame=
0;b.melting=false;b.setOpacity(b.o,1);b.o.style.padding="0px";b.o.style.margin="0px";b.o.style.fontSize=b.fontSize+"px";b.o.style.lineHeight=a.flakeHeight+2+"px";b.o.style.textAlign="center";b.o.style.verticalAlign="baseline";b.x=parseInt(g(h-a.flakeWidth-20),10);b.y=parseInt(g(j)*-1,10)-a.flakeHeight;b.refresh();b.o.style.display="block";b.active=1};this.recycle();this.refresh()};this.snow=function(){for(var c=0,d=0,e=0,f=null,f=a.flakes.length;f--;)a.flakes[f].active===1?(a.flakes[f].move(),c++):
a.flakes[f].active===0?d++:e++,a.flakes[f].melting&&a.flakes[f].melt();if(c<a.flakesMaxActive&&(f=a.flakes[parseInt(g(a.flakes.length),10)],f.active===0))f.melting=true};this.mouseMove=function(c){if(!a.followMouse)return true;c=parseInt(c.clientX,10);c<k?p=-2+c/k*2:(c-=k,p=c/k*2)};this.createSnow=function(c,d){var e;for(e=0;e<c;e++)if(a.flakes[a.flakes.length]=new a.SnowFlake(a,parseInt(g(6),10)),d||e>a.flakesMaxActive)a.flakes[a.flakes.length-1].active=-1;y.targetElement.appendChild(x)};this.timerInit=
function(){a.timers=!A?[setInterval(a.snow,a.animationInterval)]:[setInterval(a.snow,a.animationInterval*3),setInterval(a.snow,a.animationInterval)]};this.init=function(){var c;for(c=0;c<a.meltFrameCount;c++)a.meltFrames.push(1-c/a.meltFrameCount);a.randomizeWind();a.createSnow(a.flakesMax);a.events.add(e,"resize",a.resizeHandler);a.events.add(e,"scroll",a.scrollHandler);a.freezeOnBlur&&(i?(a.events.add(d,"focusout",a.freeze),a.events.add(d,"focusin",a.resume)):(a.events.add(e,"blur",a.freeze),a.events.add(e,
"focus",a.resume)));a.resizeHandler();a.scrollHandler();a.followMouse&&a.events.add(i?d:e,"mousemove",a.mouseMove);a.animationInterval=Math.max(20,a.animationInterval);a.timerInit()};this.start=function(c){if(w){if(c)return true}else w=true;if(typeof a.targetElement==="string"&&(c=a.targetElement,a.targetElement=d.getElementById(c),!a.targetElement))throw Error('Snowstorm: Unable to get targetElement "'+c+'"');if(!a.targetElement)a.targetElement=!i?d.documentElement?d.documentElement:d.body:d.body;
if(a.targetElement!==d.documentElement&&a.targetElement!==d.body)a.resizeHandler=a.resizeHandlerAlt;a.resizeHandler();a.usePositionFixed=a.usePositionFixed&&!t;n=a.usePositionFixed;if(h&&j&&!a.disabled)a.init(),a.active=true};a.autoStart&&a.events.add(e,"load",r,false);return this}(window,document);</script>
Como você pode imaginar o efeito neve funciona melhor em sites que usam cores ou imagens de fundo de cor escura, mas é possível alterar a cor dos flocos neve que na verdade são pontinhos coloridos. Para fazer isso procure o trecho: this.snowColor="#fff"
E modifique as letras fff para usar cor que desejar, veja aqui o Código das Cores.
Claro que esse efeito só será útil ou agradável para alguns blogs dependendo do tipo de publico que visita seu blog, por isso avalie se os seus visitantes vão gostar de ver caindo neve no seu blog. Se você pode ver aqui outro código com efeito neve para usar no seu blog neste final de ano. Temos também outro código para enfeitar o blog são as estrelinhas caindo do ponteiro do mouse.
Aproveitando esse clima de Natal e Ano Novo aproveite para repensar algumas coisas sobre seu blog, veja algumas dicas para melhorar seu site:
Como Garantir que um Blog tenha Sucesso na Internet?
O que você não gosta em um blog?
Como Fazer Avaliação de Blogs: Entender Estatísticas e Resultados
Abraços e Feliz Natal a todos os blogueiros!
Esse é o pior código já inventado por um web desingner!
ResponderExcluirÉ horrível entra em um site e começar cair esses flocos de neve! Apesar de ser pesado não tem porque usar isso.
Eu prefiro dar só um estilizada no log mesmo :D
Leo Utihaentendo seu ponto de vista, mas o que é util ou não vai depender muito para qual o publico de cada blog.
ResponderExcluirpor exemplo um gadget com placar de futebol é muito bom para um blog de esportes mas seria totalmente inútil num blog sobre artesanato.
muito bom!
ResponderExcluirVou tentar botar no blog
ResponderExcluirSeligamanee.blogspot.com.br
Legal!!!
ResponderExcluirDeu certo....
rahkellzinha@blogspot.com.br
ai Fabiano tem como mudar a cor do blocos de neve ? por que o meu blog já branco ai nem da para ver !
ResponderExcluirpara alterar a cor é só mudar o trecho
ResponderExcluirhis.snowColor="#fff"
o fff é a cor. Veja no tutorial um link para o código das cores
Ai Fabiano valeu deu certo ! mais queria mudar as neve o colocar outras coisas caindo como faço ? e também aumentar o tamanho das neve que vai cair você sabe como muda esse duas coisas ?? obrigado pela sua atenção
ResponderExcluirnão tentei modificar o tamanho da neve... então não sei como fazer
ResponderExcluirsobre outras coisas caindo na pagina no tutorial tem um link para estrelinhas caindo do mouse
como tira essa neve
ResponderExcluirpara retirar o efeito neve tem que apagar o código que colocou
ResponderExcluirObrigadão valeu Fabiano Roberto achei legal gostei e já esta do meu site http://www.oconciliador.net Abração.
ResponderExcluiro único que deu certo agradecido
ResponderExcluirlegal acho que meus seguidores vao gostar!
ResponderExcluirSuper legal! Deu certo! Gostei muito!!!!
ResponderExcluirEU SOU NOVA NESSAS COISAS DE COMPUTAÇÃO...MAIS EU SEI QUE VAI SER UMA BURRICE EU PERGUNTAR ISSO,MAIS EU NECESSITO SABER...''O QUE É GADGET?''
ResponderExcluirBOYBAND ONE DIRECTION!!! entre na pagina layout é verá os gadgets e como adicionar novo ou mudar de lugar os já existentes.
ResponderExcluirgadgets são especies de acessórios que o blogger tem para você adicionar ao seu blog. Um deles é o html/javascript, este gadget não faz nada sozinho, mas permite você colocar naquele lugar diversos códigos html e javascripts fornecidos por outros sites no seu blog.
muito bom mais como faço para somente cair em um lufgar ou seve somente no espaço do gadget em vez de cair no site todo ? agradecido se responder ^^
ResponderExcluirYan San Akichi não tem como fazer o código funcionar somente em uma parte do blog.
ResponderExcluirJá tá no meu blog também, estou muito satisfeita obrigado
ResponderExcluirhttp://pattyspinksforever.blogspot.com.br/
Ótimo! Coloquei no meu. (Meu público é do Brasil, U.S.A. e Alemanha).
ResponderExcluirhttp://equineland.blogspot.com.br/
parabens pelo seu blog
ResponderExcluirachei uma gracinha ....
ResponderExcluire ja coloquei no meu ;)
seu blog esta me ajudando muito !!! parabens ...
Amei os flocos, as estrelinhas, o slide rs
ResponderExcluirTem como aumentar a quantidade flocos??
Parabéns!!!
o numero de flocos é aqui
ResponderExcluirhis.flakesMax=128
mas não aumente muito senão pode deixar sua pagina lenta
eu não entendi como se coloca imagem na ponta do mouse assim
ResponderExcluirTem como colocar outra imagem caindo? Ou só os floquinhos...
ResponderExcluirAnônimo
ResponderExcluircom esse código só os floquinhos, mas no tutorial tem links para o efeito neve que são imagens caindo... então nele pode usar a imagem que você quiser
Fabiano Roberto, parabéns por este tutorial! Estamos a aprender muito com seu trabalho. Boas Festas e Feliz 2014.
ResponderExcluirJoão
ResponderExcluirobrigado e feliz ano novo para você também
Fabiano Roberto,#Valeuuuu!! só tenho à Aprender com todos esses tutoriais.
ResponderExcluirTudo de bom e cada vez mais sucesso com seu Blog.
fica difícil copiar o código com esse bloqueio que vc colocou!!!!
ResponderExcluirnão tem código de bloqueio
ResponderExcluirtop!
ResponderExcluirVlw deu tudo certo
ResponderExcluirObrigado pela ajuda
ResponderExcluir