IM12 Imagens que Surgem - formatação adian

    
IM12 Imagens que Surgem

O script apresenta pra vc um efeito fofinho onde duas imagens surgem da imagem principal.
Aconselho vc primeiramente dar uma olhada no modelo dessa aula. Antes de criar a sua formatação.

1 - Primeiro passo é criar a tag que será a imagem central. Crie sua própria tag com as seguintes medidas 750x478
 : o script até permite mudar a medida da imagem central mas aconselho que não faça para não perder a beleza do conjunto.

A minha Tag ficou assim:

2 - Vamos agora ter que criar uma pattern nas medias 60x60pixels que combine com sua tag que iremos usar no background:

A minha pattern ficou assim:

3 - Vamos ainda precisar de um imagem que combine com a tag, como estou usando o tema aniversário pra criar minha formatação, usei um balão para complementar
PS: Essa imagem deverá ter fundo transparente. Portanto, deverá ser um gif estático, ou animado. Eu dou preferência  a um estático para que não interfira no resultado final do script.

essa é a minha imagem

Se vc quiser usar o balãozinho use o botão direito para salvar. Pra tocar de cor use o colorize do PSP.
4 - Para complementar o material necessário.  Ainda precisaremos de mais duas cores uma para o fundo e outra para a tabela.
Capturei da minha tag um tom claro para usar no fundo:#fbe8e4
E um tom escuro para usar na borda da tabela:#ecaaa7
5 - Para a caixa de texto eu desci um tom da cor que usei no fundo, fiz isso no próprio PSP:#f3f3f3
6 - Escreva normalmente na caixa de texto depois com o próprio Outlook troque a cor do texto.

Material todo Prontinho vamos ao Outlook

7 - Abro no Outlook, uma nova mensagem .
8 - Como vamos usar  o processo de substituição do código e sua posterior complementação.  Clico na abinha "Origem".
9 - Deleto todo o código existente e colo em seu lugar o código abaixo:

Script -  Imagens Surgindo

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>ballons</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<STYLE type=text/css>BODY {
BORDER-RIGHT: #ecaaa7 1px solid; BORDER-TOP: #ecaaa7 1px solid; SCROLLBAR-HIGHLIGHT-COLOR: #ecaaa7; BORDER-LEFT: #ecaaa7 1px solid; SCROLLBAR-SHADOW-COLOR: #ecaaa7; SCROLLBAR-ARROW-COLOR: #ecaaa7; SCROLLBAR-TRACK-COLOR: #fbe8e4; BORDER-BOTTOM: #ecaaa7 1px solid; SCROLLBAR-BASE-COLOR: #fbe8e4
}
.tab1 {
BORDER-RIGHT: #ecaaa7 2px solid; BORDER-TOP: #ecaaa7 2px solid; BORDER-LEFT: #ecaaa7 2px solid; BORDER-BOTTOM: #ecaaa7 2px solid; BACKGROUND-COLOR: #fbe8e4
}
.tab2 {
BORDER-RIGHT: #ecaaa7 2px dashed; BORDER-TOP: #ecaaa7 2px dashed; BORDER-LEFT: #ecaaa7 2px dashed; BORDER-BOTTOM: #ecaaa7 2px dashed
}
.tab3 {
BORDER-RIGHT: #ecaaa7 1px solid; BORDER-TOP: #ecaaa7 1px solid; BORDER-LEFT: #ecaaa7 1px solid; BORDER-BOTTOM: #ecaaa7 1px solid
}
.offs {
LEFT: -1800px; POSITION: absolute; TOP: -1800px
}
.im {
Z-INDEX: 4; FILTER: alpha (opacity=60, style=0); LEFT: -1800px; VISIBILITY: hidden; POSITION: absolute; TOP: -1800px
}
.tekst {
PADDING-RIGHT: 10px; PADDING-LEFT: 10px; FONT-WEIGHT: normal; FONT-SIZE: 12pt; PADDING-BOTTOM: 10px; OVERFLOW: auto; COLOR: #ecaaa7; PADDING-TOP: 10px; FONT-FAMILY: verdana; HEIGHT: 200px; TEXT-ALIGN: center
}
A:link {
FONT-SIZE: 10pt; COLOR: #ecaaa7; FONT-FAMILY: verdana
}
A:visited {
FONT-SIZE: 10pt; COLOR: #ecaaa7; FONT-FAMILY: verdana
}
A:active {
FONT-SIZE: 10pt; COLOR: #ecaaa7; FONT-FAMILY: verdana
}
</STYLE>
<!--achtergrondkleur aanpassen-->
<META content="MSHTML 6.00.2900.3157" name=GENERATOR></HEAD>
<BODY id=body bgColor=#ecaaa7>
<DIV>&nbsp;</DIV><!--muziek midi--><BGSOUND balance=0 src="CAMINHO DA MÚSICA"
volume=0 loop=infinite><!--achtergrond rand en lijntjes--><IMG class=offs
id=back src="CAMINHO DA PATTERN">
<TABLE class=tab1 cellSpacing=25 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE class=tab2 cellSpacing=1 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE class=tab3 cellSpacing=1 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE class=tab2 cellSpacing=25 align=center border=0>
<TBODY>
<TR>
<TD>
<TABLE class=tab1 id=tb1 cellSpacing=30 align=center
border=0>
<TBODY>
<TR>
<TD align=middle>
<DIV
style="WIDTH: 750px; POSITION: relative; HEIGHT: 478px"><!--hoofdplaatje, maat hiervoor vermelden--><IMG
src="CAMINHO DA IMAGEM PRINCIPAL - A TAG">
<!--gifjes, maat vermelden--><IMG class=im id=pl1
height=250
src="CAMINHO DA GIF ESTÁTICA"
width=200> <IMG class=im id=pl2 height=189
src="CAMINHO DA GIF ESTÁTICA"
width=200></DIV><BR><BR>
<TABLE class=tab cellSpacing=3 align=center
border=0>
<TBODY>
<TR>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 100px"></DIV></TD>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 150px"></DIV></TD>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 200px"></DIV></TD>
<TD align=middle width="100%"><!--tekstvak, wijdte maat hoofdplaatje min 100px vermelden!!!-->
<DIV class=tekst style="WIDTH: 750px"
align=center>
<DIV>ESCREVA SEU TEXTO
AQUI<BR><BR><BR></DIV></DIV></TD>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 200px"></DIV></TD>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 150px"></DIV></TD>
<TD>
<DIV class=tab2
style="WIDTH: 6px; HEIGHT: 100px"></DIV></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

</TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>
<SCRIPT language=VBscript>
'---------------------------------
'script written by Annem@rie
'http://www.annemaries.nl/
'juli 2007
'Please don't remove these lines
'--------------------------------
window.status="ESCREVA AQUI SUA MENSAGEM DE RODAPÉ"

SetLocale("en-gb")

Dim scw,sch,plh,plw,th1,pl1t,pl1l,th2,pl2t,pl2l

body.style.backgroundImage="URL("&back.src&")"
tb1.style.backgroundImage="URL("&back.src&")"

plw=pl1.offsetwidth
plh=pl1.offsetheight

Sub Window_Onload()
scw=document.body.clientWidth
sch=document.body.clientHeight
document.body.style.overflowX="hidden"
SetTimeOut "komen",10
End Sub

Sub komen()
ClearTimeOut
SetTimeOut "move1", 750
SetTimeOut "move2", 2750
end sub

Sub move1()
ClearTimeOut(th)
pl1.style.visibility="visible"
pl1.style.height=plh
pl1.style.width=plw
pl1t=110
pl1l=110
pl1.style.postop=pl1t
pl1.style.posleft=pl1l
settimeout "up1",50
End Sub
Sub up1()
Cleartimeout
pl1t=pl1t-5.75
pl1l=pl1l+2
pl1.style.postop=pl1t
pl1.style.posleft=pl1l
if pl1t=<-plh*1.75 then Settimeout "move1", 50 else Settimeout "up1", 50
End Sub
Sub move2()
ClearTimeOut(th)
pl2.style.visibility="visible"
pl2.style.height=plh
pl2.style.width=plw
pl2t=100
pl2l=120
pl2.style.postop=pl2t
pl2.style.posleft=pl2l
settimeout "up2",50
End Sub
Sub up2()
Cleartimeout
pl2t=pl2t-5
pl2l=pl2l+3.5
pl2.style.postop=pl2t
pl2.style.posleft=pl2l
if pl2t=<-plh*1.5 then Settimeout "move2", 50 else Settimeout "up2", 50
End Sub

Sub window_OnResize()
window.location.reload
End Sub

</SCRIPT>
</BODY></HTML>

  para as substituições

Os códigos que estão destacados em vermelho, são os responsáveis pelas cores da bordas do e-mail e da barra de rolagem.
Os códigos em azul são responsável pela cores nas tabelas tanto das bordas como do fundo , caixa de texto e  fonte.
Em rosa está destacado a cor do fundo do papel de carta
Em roxo  está destacado a música que vc vai inserir pelo caminho: Formatar/Plano de Fundo/Som
Em laranja está destacado onde vc deve inserir o caminho da pattern
Em verde escuro está destacado onde vc  dever inserir o caminho da imagem principal ( da Tag).
Em verde limão, destaquei os códigos responsáveis pelas medidas do da Tag, aconselho não alterar essas medidas.
Em Vermelho escuro, estão  destacado onde vc dever inserir o caminho da Gif Estática
Em amarelo está destacado onde vc deve inserir a mensagem de rodapé

10 - Após colado o script na Origem, feito todas as modificações, coloque na abinha "Visualizar" para verificar o resultado.
11 -  Estando tudo certinho, volte para a abinha "Editar", dê um duplo clique na caixa de texto. Digite aí sua mensagem. Se  for copiar e colar, não esqueça de colá-lo antes no bloco de notas.
12 - Insira ainda uma bela música. Pelo caminho: Formatar/ Plano de fundo/Som

Prontinho. Agora é só enviar para as suas pessoas queridas
Espero que tenha aprovado
bom estudo pra vc

beijos,

brisa®

IM12 - Envie um e-mail com sua linda formatação personalizada:
Ele deverá conter:
Script Imagens que surgem T
Background com uma pattern e com cor sólida
Uma tag com as medidas de 750 x 478 pixels
Uma gif estáticas
Gifs animadas para enfeitar o  texto ( opcional)
Texto
Música




Não esqueça, por favor:
Você deve usar seu próprio material para a formatação
BBBB Colocar no assunto: seu nome ou nick -IM12 - Efeito: Imagens que surgem
Colocar no corpo do e-mail o link correspondente a esse tutorial inserido como hiperlink numa imagem pequena ou palavra.
Verificar o peso de sua mensagem.
Não esqueça principalmente do anti-banner, sem ele o banner poderá estragar sua linda formatação

Copyright© 2002/2007 Dama Da Noite * Todos os direitos reservados*

Esse  tutorial foi criado por  brisa® em setembro de 2007, especialmente para o Grupo PSP Brasil.

É expressamente proibida, por lei, a divulgação desta página em outro site ou qualquer outro modo de veiculação sem a autorização expressa da autora ou dos detentores de copyright do texto, da formatação e dos demais elementos que compõem a página. 

Direitos Autorais protegidos pela Lei 9.610 de 19/02/1998.