Web Toolbar by Wibiya

31/12/2011

Efeito Fogos de Artifício Coloridos no Blog


Gente a minha amiga Didi do Blog Price Tag está concorrendo a Melhor Design. Gostaria muito que se vocês puderem votem nela, ela é uma ótima pessoa e se ela vencesse ficaria muito feliz pois ela merece e por que (detalhe) fui eu quem fiz o design dela, e saberia que meu trabalho valeu a pena se ela ganhasse. Ela está concorrendo neste blog aqui, a enquete está na barra lateral na parte "Melhor Designer" aí vocês votam "Price Tag". Também fiz uma nova amiga, o nome dela é Jéssica, mas já gosto muito dela e ela está concorrendo no "Meu blog vale ouro" lá no blog Perfeitinha (a enquete está na barra lateral). Todos os blogs nesse concurso são maravilhosos, mas acho que seria legal darem uma chance pra Jéssica, é só votar no "Blog Jéssica" *--*


Hoje é Reveillon, e hoje trouxe um efeito que combina muito com o momento! Vá em Design, Editar HTML, aperte Ctrl+F e procure por:

</head>

Acima do texto encontrado coloque o seguinte código ( as partes em roxo você apaga):

<script type='text/javascript'>
//<![CDATA[
// Fogos de Artifício
var bits=200; // Número de pontos
var intensity=10; // Intensidade da explosão (recomendado entre 5 e 10)
var speed=30; // Velocidade (quanto menor o número mais rápido fica)
var colours=new Array("#FF1493", "#9400D3", "#FFFF00", "#40E0D0", "#FF3E96", "#1E90FF");
// Cores dos fogos (é só substituir as partes em azul pelo código HTML das cores desejadas dessa tabela aqui)

var dx, xpos, ypos, bangheight;
var Xpos=new Array();
var Ypos=new Array();
var dX=new Array();
var dY=new Array();
var decay=new Array();
var colour=0;
var swide=800;
var shigh=600;
function write_fire() {
var b, s;
b=document.createElement("div");
s=b.style;
s.position="absolute";
b.setAttribute("id", "bod");
document.body.appendChild(b);
set_scroll();
set_width();
b.appendChild(div("lg", 3, 4));
b.appendChild(div("tg", 2, 3));
for (var i=0; i<bits; i++) b.appendChild(div("bg"+i, 1, 1));
}
function div(id, w, h) {
var d=document.createElement("div");
d.style.position="absolute";
d.style.overflow="hidden";
d.style.width=w+"px";
d.style.height=h+"px";
d.setAttribute("id", id);
return (d);
}
function bang() {
var i, X, Y, Z, A=0;
for (i=0; i<bits; i++) {
X=Math.round(Xpos[i]);
Y=Math.round(Ypos[i]);
Z=document.getElementById("bg"+i).style;
if((X>=0)&&(X<swide)&&(Y>=0)&&(Y<shigh)) {
Z.left=X+"px";
Z.top=Y+"px";
}
if ((decay[i]-=1)>14) {
Z.width="3px";
Z.height="3px";
}
else if (decay[i]>7) {
Z.width="2px";
Z.height="2px";
}
else if (decay[i]>3) {
Z.width="1px";
Z.height="1px";
}
else if (++A) Z.visibility="hidden";
Xpos[i]+=dX[i];
Ypos[i]+=(dY[i]+=1.25/intensity);
}
if (A!=bits) setTimeout("bang()", speed);
}

function stepthrough() {
var i, Z;
var oldx=xpos;
var oldy=ypos;
xpos+=dx;
ypos-=4;
if (ypos<bangheight||xpos<0||xpos>=swide||ypos>=shigh) {
for (i=0; i<bits; i++) {
Xpos[i]=xpos;
Ypos[i]=ypos;
dY[i]=(Math.random()-0.5)*intensity;
dX[i]=(Math.random()-0.5)*(intensity-Math.abs(dY[i]))*1.25;
decay[i]=Math.floor((Math.random()*16)+16);
Z=document.getElementById("bg"+i).style;
Z.backgroundColor=colours[colour];
Z.visibility="visible";
}
bang();
launch();
}
document.getElementById("lg").style.left=xpos+"px";
document.getElementById("lg").style.top=ypos+"px";
document.getElementById("tg").style.left=oldx+"px";
document.getElementById("tg").style.top=oldy+"px";
}
function launch() {
colour=Math.floor(Math.random()*colours.length);
xpos=Math.round((0.5+Math.random())*swide*0.5);
ypos=shigh-5;
dx=(Math.random()-0.5)*4;
bangheight=Math.round((0.5+Math.random())*shigh*0.4);
document.getElementById("lg").style.backgroundColor=colours[colour];
document.getElementById("tg").style.backgroundColor=colours[colour];
}
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;
}
var s=document.getElementById("bod").style;
s.top=sdown+"px";
s.left=sleft+"px";
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
window.onload=function() { if (document.getElementById) {
set_width();
write_fire();
launch();
setInterval('stepthrough()', speed);
}}
//]]>
</script>

Espero que consigam e feliz fim de ano!

13 Comentários:

*Price Tag* disse... [Responder essa Fofura]

Oi dedessa!!Obrg por divulgar o concurso!Estou mt agradecida!Ah!Também amei o efeito fogos de artificio,dá certinho para essa época de reveillon!Feliz Ano Novo!!Desejo tudo de bom para você,para seus familiares e,claro,a *TudyTeen*,que ela continue ajudando a todos,e dando dicas maravilhosas! i ♥ a *TudyTeen*!Bjs!

*Price Tag* disse... [Responder essa Fofura]

Ah!Outra coisa:Parabéns pelos 300 seguidores e pelas 10747 visitas!!

Jéssica Bogoni Cortes disse... [Responder essa Fofura]

aii muuuito obg dedessaaa!

CaioAD disse... [Responder essa Fofura]

Haha ,com certeza vou fazer esse tuto =D
Estou seguinte, pode seguir de volta?

http://uniaogeek.blogspot.com/

Julia Rocha disse... [Responder essa Fofura]

De nada Flor,Adoreii os FOGUINHOS!!!
Lindo,Lindo Vai la participar do nosso Concurso

Quer ser minha parceira?
http://yesteens2.blogspot.com

Julia Rocha disse... [Responder essa Fofura]

Que pena que vc n vai poder participar!:(

Flor eu posso colocar so o seu nome,nome do blog e link direto igual eu fiz com os outros parceiros,eles aceitaram voce aceita,flor??

OBRIGADA,POR TUDO
vc ja ta la
jbjbjb

Julia Rocha disse... [Responder essa Fofura]

Brigadinha,vc ja ta la!
VOTA NA NOSSA ENQUETE(do concurso q vc n pode participar!)

se puder ne?
bjbjbj

Julia Rocha disse... [Responder essa Fofura]

Eu ja estou como sua parceira,floor???

bjbj responde pelo yesteen

nao me vi la!
vc ainda vai coloca?

Julia Rocha disse... [Responder essa Fofura]

Brigadinha flor,mas sem querer abusar de vc pode colocar o gif bjbj?

Dedessa (*TudyTeen*) disse... [Responder essa Fofura]

Respondi *--*

♪♫Blog da Lúh♪♫ disse... [Responder essa Fofura]

Adorei o post e seu layout é lindo!
Emfim, já estou seguindo!
Dá uma passadinha no meu blog?

Dedessa (*TudyTeen*) disse... [Responder essa Fofura]

Claro :D

Virgínia Santana disse... [Responder essa Fofura]

oi flor como vc colocou esses efeitos nos comentarios e essas estrelinhas caindo quando movemos e outra coisa kkkkk não tem uma forma mais facil de fazer isso pois eu sou muito desajeitada e tenho medo de fazer algo errado kkkkk bjs vai la no meu e me segue ta ?http://mariatodabonita.blogspot.com.br/