Assine nosso Feed e receba grátis novos artigos em seu E-mail. Assine Aqui

Saiba como colocar efeito neve caindo sobre seu blog

♠ Posted by Unknown in ,,, at 20:51
Olá gente !!!
Há muito tempo não postava um artigo como este que estou trazendo hoje aqui pra vocês.
Gosto muito de postar novos gadgets (Acessórios) que encontro nas minhas pesquisas pela net e hoje quero lhes trazer um gadget bacana que encontrei em um blog da Espanha.
Esse gadget é muito fácil de instalar em seu blog.
Vamos lá então:


Abra o painel do seu Blogger e no blog em que você vai instalar o gadget vá até o menu lateral e clique em: "Layout"


Ao clicar em "Layout" aparecerá uma nova tela aonde aparecerá vários pontos com a opção "Adicionar um Gadget".


Escolha um local de preferência na lateral da página e clique sobre ele e ai aparecera uma janela com várias opções, escolha "HTML/JavaScript" como na imagem abaixo.



Ao clicar nessa janela aparecerá o local aonde você vai colocar o código HTML do gadget.


Agora clique em "Salvar" e pronto, clique em "Visualizar blog" e veja se ficou do seu agrado.

O número 30 em vermelho é o numero de flocos de neve que irá cair sobre o blog, você pode alterar para a quantidade que  quiser alterando o número antes de salvar.

Este gadget estará instalado no meu blog Saquaphotos até o fim do inverno desse ano, depois instalarei outro gadget de acordo com a estação do ano.



<script type="text/javascript">
  //Configure below to change URL path to the snow image
  var snowsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjGV4suhROrD3zb_Gd_KUEEtSNwxhL56brGwQJ94Jb_aVrIwSa15FVq_BPgpjd3gNnLEKe_J_oMmIjQJJgZCcRLbI0wMwY9lLv2cuN-sYmWmVXSRp9wuz5Jj4doj-QEtE2yIuz7_9_EvcE/s400/snow.gif"
  // Configure below to change number of snow to render
  var no = 30;
  // Configure whether snow should disappear after x seconds (0=never):
  var hidesnowtime = 0;
  // Configure how much snow should drop down before fading ("windowheight" or "pageheight")
  var snowdistance = "pageheight";
///////////Stop Config//////////////////////////////////
  var ie4up = (document.all) ? 1 : 0;
  var ns6up = (document.getElementById&&!document.all) ? 1 : 0;
    function iecompattest(){
    return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
    }
  var dx, xp, yp;    // coordinate and position variables
  var am, stx, sty;  // amplitude and step variables
  var i, doc_width = 800, doc_height = 600;
  if (ns6up) {
    doc_width = self.innerWidth;
    doc_height = self.innerHeight;
  } else if (ie4up) {
    doc_width = iecompattest().clientWidth;
    doc_height = iecompattest().clientHeight;
  }
  dx = new Array();
  xp = new Array();
  yp = new Array();
  am = new Array();
  stx = new Array();
  sty = new Array();
  snowsrc=(snowsrc.indexOf("dynamicdrive.com")!=-1)? "http://2.bp.blogspot.com/-MsCdyoGtGdA/UX5gk72qNoI/AAAAAAAAAfQ/LaKTmUG-aJM/s1600/snow+falling+effect.gif" : snowsrc
  for (i = 0; i < no; ++ i) { 
    dx[i] = 0;                        // set coordinate variables
    xp[i] = Math.random()*(doc_width-50);  // set position variables
    yp[i] = Math.random()*doc_height;
    am[i] = Math.random()*20;         // set amplitude variables
    stx[i] = 0.02 + Math.random()/10; // set step variables
    sty[i] = 0.7 + Math.random();     // set step variables
        if (ie4up||ns6up) {
      if (i == 0) {
        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><a href=\"http://dynamicdrive.com\"><img src='"+snowsrc+"' border=\"0\"><\/a><\/div>");
      } else {
        document.write("<div id=\"dot"+ i +"\" style=\"POSITION: absolute; Z-INDEX: "+ i +"; VISIBILITY: visible; TOP: 15px; LEFT: 15px;\"><img src='"+snowsrc+"' border=\"0\"><\/div>");
      }
    }
  }
  function snowIE_NS6() {  // IE and NS6 main animation function
    doc_width = ns6up?window.innerWidth-10 : iecompattest().clientWidth-10;
        doc_height=(window.innerHeight && snowdistance=="windowheight")? window.innerHeight : (ie4up && snowdistance=="windowheight")?  iecompattest().clientHeight : (ie4up && !window.opera && snowdistance=="pageheight")? iecompattest().scrollHeight : iecompattest().offsetHeight;
    for (i = 0; i < no; ++ i) {  // iterate for every dot
      yp[i] += sty[i];
      if (yp[i] > doc_height-50) {
        xp[i] = Math.random()*(doc_width-am[i]-30);
        yp[i] = 0;
        stx[i] = 0.02 + Math.random()/10;
        sty[i] = 0.7 + Math.random();
      }
      dx[i] += stx[i];
      document.getElementById("dot"+i).style.top=yp[i]+"px";
      document.getElementById("dot"+i).style.left=xp[i] + am[i]*Math.sin(dx[i])+"px"; 
    }
    snowtimer=setTimeout("snowIE_NS6()", 10);
  }
    function hidesnow(){
        if (window.snowtimer) clearTimeout(snowtimer)
        for (i=0; i<no; i++) document.getElementById("dot"+i).style.visibility="hidden"
    }
if (ie4up||ns6up){
    snowIE_NS6();
        if (hidesnowtime>0)
        setTimeout("hidesnow()", hidesnowtime*1000)
        }
</script>



Por hoje é só, mas virá outros gadgets ainda mais bacanas por ai, aguardem !!!

Fiquem a vontade para deixar seus comentários.

Fonte: Gadgets para Blogger




Programa de Afiliados Cursos 24 Horas

0 comentários:

Postar um comentário

Este blog lhe foi útil ?
Assine o nosso Feed e receba nossas atualizações no seu e mail.