Uma outra chuva de estrelas

Se você quiser um efeito de estrelinhas, sem ter que colocar nenhuma imagem em seu e-mail, como neste exemplo, faça o seguinte:

1. Abra uma nova mensagem.

2. Clique na aba "Origem" de sua nova mensagem.

3. Apague tudo o que encontrar e coloque o código que aparece logo abaixo:


----------------------------------------------------------------------------------------------------------------------------------------------------------------

<META HTTP-EQUIV="Content-Type" CONTENT="text/html;charset=iso-8859-1">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><title>Tutorial de E-mails - Lili - Chuva de estrelas</title><HEAD>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<META content="MSHTML 6.00.2800.1106" name=GENERATOR>
<STYLE></STYLE>

<STYLE type=text/css>
.star {position:absolute;
layer-background-color:#0E4D7E;
visibility:visible;
top:-50px; width:50px;
height:50px;
font-size:1px;
background-color:#0E4D7E}
</STYLE>

<SCRIPT>
// Nombre d'étoiles souhaitées
var starnum=90;
///////////////////////////////////////////////////////
var isNS=(document.layers);
var _all= (isNS)? '' : 'all.' ;
var _style= (isNS) ? '' : '.style' ;
var xoffset, yoffset, w_x, w_y, tmpx, tmpy, scrlx, scrly;

function getstartpos(obj){
obj.deltay=Math.floor(Math.random()*12);
obj.deltax=Math.floor(Math.random()*12);
obj.xdir=(Math.floor(Math.random()*2)==1)? '' : '-' ;
obj.ydir=(Math.floor(Math.random()*2)==1)? '' : '-' ;
obj.counter=1;
if(isNS){
obj.clip.width=1;
obj.clip.height=1;
obj.moveTo(xoffset+pageXOffset,yoffset+pageYOffset);
}else{
obj.width=1;
obj.height=1;
obj.pixelTop=yoffset+document.body.scrollTop;
obj.pixelLeft=xoffset+document.body.scrollLeft;
}}

function movestar(){
for(i=1;i<=starnum;i++){
starN=eval('star'+i);
tmpx=starN.deltax*starN.counter+starN.counter;
tmpy=starN.deltay*starN.counter+starN.counter;
if(isNS){
starN.clip.width=starN.counter/3;
starN.clip.height=starN.counter/3;
scrlx=pageXOffset;
scrly=pageYOffset;
if((starN.left+tmpx*1.2>=w_x+scrlx) || (starN.top+tmpy*1.5>=w_y+scrly) || (starN.left-tmpx*1.2<=scrlx) || (starN.top-tmpy*1.5<=scrly)){
getstartpos(starN);
}else{
eval('starN.moveBy('+starN.xdir+tmpx+', '+starN.ydir+tmpy+')');
}}else{
starN.width=starN.counter/3;
starN.height=starN.counter/3;
scrlx=document.body.scrollLeft;
scrly=document.body.scrollTop;
if((starN.pixelLeft+tmpx*1.2>=w_x+scrlx)||(starN.pixelTop+tmpy*1.5>=w_y+scrly) || (starN.pixelLeft-tmpx*1.2<=scrlx)||(starN.pixelTop-tmpy*1.5<=scrly)){
getstartpos(starN);
}else{
eval('starN.pixelTop+='+starN.ydir+'tmpy');
eval('starN.pixelLeft+='+starN.xdir+'tmpx');
}}
starN.counter++;
}}

function findwindowparams(){
w_x=(isNS)? window.innerWidth : document.body.clientWidth;
w_y=(isNS)? window.innerHeight : document.body.clientHeight;
xoffset=w_x/2;
yoffset=w_y/2;
for(i=1;i<=starnum;i++){
getstartpos(eval('star'+i));
}}

function reloadNS(){
setTimeout('reloadNS_1()', 500);
}

function reloadNS_1(){
window.location.reload();
}

(isNS)? window.onresize=reloadNS : window.onresize=findwindowparams;

window.onload=new Function("findwindowparams(); setInterval('movestar()',1);");

</SCRIPT>
</HEAD>
<BODY bgColor=#E9F2F5>
<DIV>&nbsp;</DIV>
<SCRIPT language=javascript>
for(i=1;i<=starnum;i++){
document.writeln('<div id="star'+i+'" class="star"></div>');
eval('var star'+i+'=document.'+_all+'star'+i+_style);
}
</SCRIPT>
</BODY></HTML>

 

----------------------------------------------------------------------------------------------------------------------------------------------------------------

Você pode alterar a cor das estrelas, usando outro código de cor nos itens que deixei marcados em vermelho, mas lembre-se de mudar também a cor do background (deixei marcado em verde). Se usar uma cor clara para as estrelas, use uma escura para o fundo e vice-versa.


Aqui você encontra a versão prontinha para e-mail desta dica. Está zipada no formato .eml (próprio para o Outlook Express)

(Lembre-se de clicar na aba "Visualizar" para ver o efeito.)

(Dica adaptada por Lilian Russo)

Lilian Russo - Todos os Direitos Reservados - ©2002/2007



.