[TUTORIAL] Decorando seu blog para o Dia das Bruxas

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

[TUTORIAL] Decorando seu blog para o Dia das Bruxas

Mensagem por Oto! em Dom 14 Out 2012 - 5:48

Decorando seu blog para o Dia das Bruxas

O Dia das Bruxas está chegando e seu blog pode entrar em sincronia com esta data comemorativa colocando imagens decorativas em seu blog.

--> Faqs e tutoriais <--
Decorando seu blog para o Dia das Bruxas


- Configurando o código Javascript:
Código:
    <script type="text/javascript">
    var speed=40;
    var flakes=20;
    var flake_image="http://i47.servimg.com/u/f47/15/17/71/53/vamp10.png";
    var swide, shigh;
    var dx=new Array();
    var xp=new Array();
    var yp=new Array();
    var am=new Array();
    var sty=new Array();
    window.onload=function() { if (document.getElementById) {
    var k, f, b;
    b=document.createElement("div");
    b.style.position="absolute";
    b.setAttribute("id", "bod");
    document.body.appendChild(b);
    set_scroll();
    set_width();
    for (var i=0; i<flakes; i++) {
    dx[i]=0;
    am[i]=Math.random()*20;
    xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
    yp[i]=Math.random()*shigh;
    sty[i]=0.75+1.25*Math.random();
    f=document.createElement("div");
    f.style.position="absolute";
    f.setAttribute("id", "flk"+i);
    f.style.zIndex=i;
    f.style.top=yp[i]+"px";
    f.style.left=xp[i]+"px";
    k=document.createElement("img");
    k.src=flake_image;
    f.appendChild(k);
    b.appendChild(f);
    }
    setInterval("winter_snow()", speed);
    }}
    window.onresize=set_width;
    function set_width() {
    if (document.documentElement && document.documentElement.clientWidth) {
    swide=document.documentElement.clientWidth;
    shigh=document.documentElement.clientHeight;
    }
    else if (typeof(self.innerHeight)=="number") {
    swide=self.innerWidth;
    shigh=self.innerHeight;
    }
    else if (document.body.clientWidth) {
    swide=document.body.clientWidth;
    shigh=document.body.clientHeight;
    }
    else {
    swide=800;
    shigh=600
    }
    }
    window.onscroll=set_scroll;
    function set_scroll() {
    var sleft, sdown;
    if (typeof(self.pageYOffset)=="number") {
    sdown=self.pageYOffset;
    sleft=self.pageXOffset;
    }
    else if (document.body.scrollTop || document.body.scrollLeft) {
    sdown=document.body.scrollTop;
    sleft=document.body.scrollLeft;
    }
    else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
    sleft=document.documentElement.scrollLeft;
    sdown=document.documentElement.scrollTop;
    }
    else {
    sdown=0;
    sleft=0;
    }
    document.getElementById("bod").style.top=sdown+"px";
    document.getElementById("bod").style.left=sleft+"px";
    }
    function winter_snow() {
    for (var i=0; i<flakes; i++) {
    yp[i]+=sty[i];
    if (yp[i]>shigh-30) {
    xp[i]=am[i]+Math.random()*(swide-2*am[i]-25);
    yp[i]=0;
    sty[i]=0.75+1.25*Math.random();
    }
    dx[i]+=0.02+Math.random()/10;
    document.getElementById("flk"+i).style.top=yp[i]+"px";
    document.getElementById("flk"+i).style.left=(xp[i]+am[i]*Math.sin(dx[i]))+"px";
    }
    }
    </script>

Modifique o código nesta parte:
var speed=cifra; // Velocidade (menor número mais rápido)
var flakes=cifra; // Número de morcegos (No caso a imagem atual)
var flake_image // Endereço da imagem

Outras imagens que podem ser usadas:

Código:
http://i45.servimg.com/u/f45/16/95/56/96/cheshi10.png


Código:
http://i45.servimg.com/u/f45/16/95/56/96/geek_z10.png


Código:
http://i45.servimg.com/u/f45/16/95/56/96/ninja_10.png


Código:
http://i45.servimg.com/u/f45/16/95/56/96/pumpki11.png


Código:
http://i45.servimg.com/u/f45/16/95/56/96/scream10.png


Código:
http://i45.servimg.com/u/f45/16/95/56/96/witch_10.png
- Adicionando o código Javascript:
Vá para Administração Artmeiros Multiblog Artmeiros Módulos Artmeiros Personalizados, adicione e salve.




© Suporte Criarumblog
Se tiver alguma dúvida relacionada com este tópico crie um tópico com o seguinte título:
[Dúvida] Decorando seu blog para o Dia das Bruxas
avatar

Oto!
Hiperativo

Inscrito dia : 07/04/2011
Mensagens : 3363
Pontos Ativos : 4818

Ver perfil do usuário http://ajuda.forumeiros.com

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum