Curso de Formatação Intermediário- Lição
20
Chuva de estrelas
O efeito "Chuva de estrelas" dá um toque interessante
ao e-mail e permite variações.
Se você quiser mandar um e-mail com o efeito de uma chuva
de estrelas, como pode ver aqui
neste exemplo, basta abrir uma nova mensagem, deletar tudo o
que aparece na aba "Origem" e colar o código abaixo:
As cores podem ser alteradas.
Em: "position:absolute; height:1; width:1; font-family:arial
black; font-size:9px; color:#FFFFAA;
z-index:10;" refere-se à cor das estrelinhas.
Se você quiser estrelas maiores, pode alterar o "font-size:9px",
por exemplo, para 18px.
Você pode também variar a velocidade das estrelinhas,
alterando o valor lá embaixo na parte do código que
mostra: tempx-=45. Quanto maior for
o número que você usar no lugar do 45,
mais rápido as estrelinhas irão "andar"
e, é lógico, quanto menor, mais lentamente elas irão
se movimentar.
Veja que há muitas variações possíveis
para este código. Lembre-se de sempre contrastar as cores:
fundo escuro/estrelas claras e fundo claro/estrlas escuras.
Experimente e veja realmente estrelinhas passeando pelo e-mail.
Faça o seguinte:
Abra uma nova mensagem.
Clique na abinha "Origem".
Use o seguinte código, logo depois de <BODY> no começo
do código:
<DIV id=sDiv0>*</DIV>
<DIV id=sDiv1>*</DIV>
<DIV id=sDiv2>*</DIV>
<DIV id=sDiv3>*</DIV>
<DIV id=sDiv4>*</DIV>
<DIV id=sDiv5>*</DIV>
<DIV id=sDiv6>*</DIV>
<DIV id=sDiv7>*</DIV>
<DIV id=sDiv8>*</DIV>
<DIV id=sDiv9>*</DIV>
<STYLE type=text/css>
#sDiv0, #sDiv1, #sDiv2, #sDiv3, #sDiv4, #sDiv5, #sDiv6, #sDiv7,
#sDiv8, #sDiv9
{
position:absolute; height:1; width:1; font-family:arial black; font-size:9px;
color:#FFFFAA; z-index:10;
}
</STYLE>
<SCRIPT language=JavaScript1.2>
<!--
/*
Document firework script (By Matt Gabbert, mgabbert@usrtoday.com,
http://www.nolag.com)
Featured on Dynamicdrive.com
For full source and 100's more DHTML scripts, visit http://www.dynamicdrive.com
*/
var ns=(document.layers);
var ie=(document.all);
var w3=(document.getElementById && self.innerWidth &&
(window.pageXOffset>-1));
//my way of making sure the browser will have what I need
var allDivs = new Array(10);
var documentWidth,documentHeight;
function initAll(){
if(!ns && !ie && !w3) return;
for(dNum=0; dNum<10; ++dNum){
if(ie) allDivs[dNum]=eval('document.all.sDiv'+dNum+'.style');
else if(ns) allDivs[dNum]=eval('document.layers["sDiv'+dNum+'"]');
else if(w3) allDivs[dNum]=eval('document.getElementById("sDiv'+dNum+'").style');
moveTo(dNum,0,0);
}
}
function moveTo(i,tempx,tempy){
if (ie){
documentWidth =document.body.offsetWidth+document.body.scrollLeft-20;
randomy=Math.floor(Math.random()*document.body.offsetHeight)+document.body.scrollTop-20;
}
else if (ns){
documentWidth=window.innerWidth+window.pageXOffset-20;
randomy=Math.floor(Math.random()*window.innerHeight)+window.pageYOffset-20;
}
else if (w3){
documentWidth=self.innerWidth+window.pageXOffset-20;
randomy=Math.floor(Math.random()*self.innerHeight)+window.pageYOffset-20;
}
if(tempx>-50){
tempx-=45;
allDivs[i].left=tempx;
allDivs[i].top =tempy;
setTimeout("moveTo("+i+","+tempx+","+tempy+")",40)
}
else
setTimeout("moveTo("+i+",documentWidth-10,randomy)",2000/i+40);
}
window.onload=initAll
//End-->
</SCRIPT>
Obs.: Este código precisa ser colocado no lugar certinho
para funcionar.
Uma dica: Primeiro coloque uma cor no fundo do e-mail, ou insira
um back ou papel de carta e use o código exatamente depois
de:
<BODY bgColor=#000000
background="C:\Arquivos de programas\Arquivos comuns\Microsoft
Shared\Papel de carta\24.jpg">
Tarefa:
Crie um novo e-mail, com papel de carta, moldura e barra de rolagem
colorida. Coloque uma mensagem de rodapé. Use o recurso de
chuva de estrelas em seu e-mail. Escreva também alguma mensagem
no corpo do e-mail, coloque uma música em formato .mid, insira
seu cartão de visitas e envie ao grupo.
Bom trabalho!
Endereço do grupo: tutorial_emails@yahoogrupos.com.br
Lembre-se de indicar no campo Assunto: Nome do aluno, Nível
e Número da lição. Caso a lição
tenha sido refeita, inclua a palavra "refeita".
Lição elaborada por Lilian Russo
Lilian Russo - Todos os Direitos Reservados - ©2002/2008
|
