29-Filtro opacity - formatação inter

    
29-Filtro opacity

O filtro Opacity suaviza a visibilidade da tabela e seus elementos. Dando um efeito de transparência.


Materiais:
Iremos precisar de um background colorido
Tabela
Uma mensagem
Alguns gifs para enfeitar o e-mail (opcional)
Uma assinatura. (Opcional)
Uma Música
Para complementar:
Um filtro para a tabela
Script para colorir a barra de rolagem
Script para mensagem no rodapé.

Lembrando que:
Todo filtro é uma linha de comando que age sobre o conjunto de códigos . Eles devem estar na posição exata para que funcionem.

1 - Depois de todo material escolhido e preparado:

Criando a Tabela
2 - Abra o Front Page e crie uma nova página em branco
3 - Cursor na posição desejada onde vc quer que a tabela seja inserida
  Dê preferência ao centro da página.
4 - No menu do Front Page:  Tabela/Inserir/Tabela
5 - Botão direito do mouse. Propriedades da tabela no Front Page 2000 , já no 2003  você pode preencher os campos já quando vai inserir a Tabela.

Primeira tabela

6 - A primeira tabela será invisível.

Dê preferência sempre antes de começar um site ou um papel de carta inserindo uma tabela invisível, pq assim teremos a certeza que nada saíra do lugar.

Configuração da tabela invisível:
Linhas:1
Colunas:1
Alinhamento =  centralizado
Flutuar: Padrão
Enchimento da célula = 0
Especificar a largura =  100%
Espaçamento da célula  =  0
Bordas -  Tamanho =  0
Borda clara =  automático
Borda escura = automático
Plano de fundo =  automático

Lembrando que para o Front Page 2000 primeiramente faz a tabela depois clica dentro dela / botão direito do mouse / Propriedades da Tabela para fazer as alterações

Ao vc colocar na abinha visualização perceberá que ela vai desaparecer. Essa tabela como já foi mencionada anteriormente somente nos servirá para que mantenha tudo em sua posição.  Pois estamos delimitando o área. Como colocamos 100% em sua largura . Tudo que está inserido dentro dessa área se adaptará a qualquer configuração de vídeo.  Por isso prefiro usar porcentagem em vez de tamanho em pixels.

Segunda Tabela:

Clique dentro da tabela transparente que ficará delimitada por linhas pontilhadas. Coloque o cursor centralizado e insira a segunda tabela.

7 - Configurações:
Linhas: 2
Colunas:1
Alinhamento =  centralizado
Flutuar: Direito
Enchimento da célula = 5
Especificar a largura =  60%
Espaçamento da célula  =  10
Bordas -  Tamanho =  70
Cor da Borda: Um tom de sua preferência
Borda clara = Um tom de sua preferência
Borda escura = Um tom de sua preferência
Plano de fundo =  Automático

Veja como ficará:

Propriedade da Célula:

Cursor dentro da tabela - botão direito do  mouse/ Propriedade da célula

Veja como ficará:

7 - Reserve



Outlook

8 - Abra o Outlook
9 - Abra uma nova mensagem

10- Insira uma cor para  plano de fundo, eu vou colocar uma cor qualquer se não tiver a cor que eu desejo, pois quero que combine com minha tabela.

11 - Volto para o FrontPage. Copio a tabela criada e colo a tabela no Outlook
12 - Se o fundo não estiver com uma cor que combine com a tabela. Clico na abinha Origem  procuro pelo código responsável pela cor do fundo e troco a cor:
Escolha uma cor que destaque a tabela.

12 - Trocada a cor volto para abinha Editar.

Veja como ficou:

Filtro  Opacity

14 - Esse filtro exerce um efeito muito interessante na tabela , que é visibilidade da tabela.
Ele afeta não somente a tabela mas tudo que está inserido dentro da tabela:
o código responsável é: style="filter: Alpha(Opacity=70)"
PS: O valor da opacity= coloque de acordo com seu gosto pessoal

Esse código é inserido logo após o comando

 < Table   id=table( valor gerado pela quantidade de tabelas geradas)

Veja o efeito que exerce sobre a tabela :

coloquei a opacity= 40%

15 - Volto para abinha editar .Escolho uma das fontes originais do Outlook e escrevo um texto.
Eu coloquei o seguinte texto:

"Não deixes de abrir uma nova porta.
Por ela podem entrar amigos inesperados,
amores verdadeiros, aventuras inesquecíveis...
E não se esqueça, principalmente,
de manter a janela bem aberta.
Ela trará, no fim de cada dia,
um lindo pôr do sol".

Veja o resultado:

Esse filtro age sobre tudo que estiver inserido na tabela. Seja , texto, gifs, Tags, assinaturas..etc... Lindo esse efeito, não??

16 - Acrescente o código para colorir sua barra de rolagem.

Scritp para Colorir Barra de Rolagem

<STYLE type=text/css>BODY {

SCROLLBAR-BASE-COLOR:código da cor

}

</STYLE>

17 - Complemente com o script do rodapé assinado  assim sua formatação. Quando colocar na abinha Editar o código se ajeitará sozinho.

Scritp para Mensagem no Rodapé

<SCRIPT language=JavaScript>
<!--
ScrollSpeed = 450; // milliseconds between scrolls
ScrollChars = 4; // chars scrolled per time period

function SetupTicker() {
// add space to the left of the message
msg = " ·.¸¸.·´¯`·.¸¸¸¸.·´¯`·.¸¸.·´¯ Escreva aqui  ·.¸¸.·´¯`·.¸¸¸¸.·´¯`·.¸¸.·´¯";
RunTicker();}

function RunTicker() {
window.setTimeout('RunTicker()',ScrollSpeed);
window.status = msg;
msg = msg.substring(ScrollChars) + msg.substring(0,ScrollChars);}
SetupTicker();

<!-- end -->
</SCRIPT>

TI 29 -  Envie para o grupo um e-mail formatado como foi ensinado nesse tutorial.
Ele deverá conter:
Iremos precisar de um background colorido
Uma Tabela
Uma mensagem
Alguns gifs para enfeitar o e-mail (opcional)
Uma assinatura. (Opcional)
Uma Música
Para complementar :
Filtro sombra para a fonte
Barras de rolagem  colorida
Mensagem no rodapé.




Não esqueça, por favor:
Colocar no assunto: seu nome ou nick - TI29 - Filtro Opacity
No corpo do e-mail coloque o link correspondente a esse tutorial.
Verificar o peso de sua mensagem.
Não esqueça do anti-banner

Prontinho.. Para visualizar o efeito coloque na abinha "Visualizar".
Depois de checado o efeito volte para a abinha  "Editar" e complete a formatação de sua mensagem.

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

Esse  tutorial foi criado por brisa®   em 20/01/2006,  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.