- PAGINA INICIAL
- APOSTILHAS PROFISSIONAIS
- AULAS DE SCRAPS E CARTÔES
- ANIMAÇÕES LEGAIS
- APOSTILAS DE CONCURSOS
- APRENDAR CRIAR SEU SITE!
- ACHE AQUI SEU EMPREGO!
- AMAZÔNIA SHOPPING
- ACREDITE SE QUISER!
- ASSESSOR VIRTUAL
- BRISA FM
- BATE PAPOS
- BOTÃO SUBIR PAGINA
- BORDAS MARQUEE
- COMUNIDADE ORKUT
- CURSOS IMPERDÍVEIS
- CALCULADORA COM SUA FOTO
- CRIANDO UMA REDE DIAL
- CRIANDO UMA REDE PRIVADA
- CRIANDO LETREIRO ANIMADO
- CRIANDO O SEU VÍDEO (FILME)
- CRIE SUA FOTO ROMÂNTICA
- CRIANDO UMA FRASE ANIMADA
- COMO PROTEGER SEUS TEXTOS
- CRIAÇÕES INCRÍVEIS
- CALCULADORA DA VIDA
- CURSOS E EMPREGOS
- CABEÇALHOS PARA SITTES
- CAPAS PARA SITES E BLOGS
- CURTA NOSSA FAN PAGES
- CONTRATOS COM EDITORAS
- COMO COMPOR POESIAS?
- CRIANDO UM BANNER GIF
- CRIANDO EFEITOS NOITE!
- CRIANDO UM SLIDE EM FLASH!
- CRIANDO UM SLIDE POWER POINT
- DICAS PROFISSIONAIS
- DEIXE AQUI SEU COMENTÁRIO
- DESBLOQUEANDO PDF
- DRIVES PARA PC
- DESTRUINDO ZUMBIS
- DIVERT RI ZADA!
- EMPREGOS E OPORTUNIDADES
- EMBELEZE SEU ROSTO
- EXTRAORDINÁRIO!
- EFEITO FRASE NO MOUSE
- FRUTOS DOS SENTIMENTOS
- FACE BOOK
- FANTÁSTICO
- FAÇA UM LETREIRO DIGITAL
- GIFS CAINDO SOBRE SUA PAGINA
- GANHE DINHEIRO AGORA!
- GANHAR DINHEIRO
- INSTALANDO UM HARDWERE
- INSTALANDO O BLUETOOTH
- INSTALANDO UM MODEM
- INACREDITÁVEL!
- JOG & BRINK GAMES
- LINK ANIMADO
- MEDITAÇÕES DIÁRIAS
- ME ENCONTRE AQUI
- MENSAGENS
- MEUS BLOGS
- MONTE SUA FOTO AQUI
- NOKIA PC SUITE
- NOVIDADES
- O LAGO DA FELICIDADE
- ORGANIZE SEU PC
- O GUERREIRO INVECÍVEL
- POEMAS
- PROFUNDEZAS DA ALMA
- PAC MAN PARCERIA
- PAGINA PROIBIDA, NÃO ENTRE!
- PAIXÃO INFLAMÁVEL
- PÁGINA LUCRATIVA
- PROMOÇÃO
- PILOTE ESSA MÁQUINA!
- PAGINA SOLIDÁRIA
- PILOTO DE GUERRA!
- QUEM SOU
- QUE LEGAL
- REFLEXÕES
- RELICÁRIO DE LEMBRANÇAS
- SEGREDOS DO SUCESSO
- SUPER JOGOS
- SHOPPING ONLINE
- SUPER CURSOS ONLINE
- SOLEIL BLUETOOH
- SUA FOTO NUM GAME?
- SUPER GAMES
- SUPER MÁQUINA
- SUPER PRÊMIOS
- TABELAS DE CORES
- TRANSFORME SEU VÍDEO EM GIF
- TUTORIAIS HTML UFPA
- TUTORIAIS DIVERSOS!
- TUTORIAIS PHOTOSCAPE
- *VINHETAS EVANGÉLICAS*
- TUTORIAL - CRIANDO BOTÕES
- TUTORIAL PROSHOW - INICIANTES
- TUTORIAL PROSHOW - BÁSICO
- TUTO PROGRAMAS CRACKEADOS
- TUTO(INCONSTRUTION)
- TUTORIAL (INCONSTRUTIONS)
- TUTORIAL LUZ SHOP
- TERAMIGOS
- (Página sem titulo)
- (Página sem titulo)
- ACESSO RESTRITO!
- ASSINE O LIVRO DE VISITAS
- FALE COM O POETA
|
1 |
NOS AJUDE A FICAR NO AR FAÇA SUA DOAÇÃO!
Visit Uniao de Blogueiros Evangelicos
++
TUTORIAIS HTML UFPA
SITE RESPONSÁVEL http://www.cultura.ufpa.br/dicas/htm/htm-efet.htm
Efeitos animados
É possível animar alguns textos com tipos especiais de formatação, sempre diretamente no código fonte.
É importante notar que recursos de animação devem ser utilizados com cuidado e parcimônia, pois em uma página que já apresenta vários motivos que chamam a atenção do leitor (figuras, cores, fontes) os efeitos animados são mais um deles, e seu uso pode ocasionar um resultado final cansativo e confuso.
Blink
A formatação Blink permite que um certo texto fique piscando em uma página, como no exemplo abaixo, centralizado e em amarelo. Pode-se aplicar outros formatos como cores, negrito, italic e alterar a fonte e o seu tamanho, normalmente.
O código é: <blink>Texto que deve piscar</blink>
Exemplo 1: Acima foi utilizado: <center><font color=#FFFF00><blink>Novo!</blink></font></center>
Exemplo 2: Segue um código para a o texto aparecer em azul "Deep Sky Blue" e em negrito: <font color=#00BFFF><b><blink>Novo!</b></blink></font>
Novo!
É recomendável que o comando blink seja usado somente em pequenos detalhes (palavras ou setas), mas não em grande número na mesma página, pois gera muito cansaço visual.
Deve-se ressaltar que nem todos os navegadores mostram o efeito dessa formatação.
Marquee
Um texto pode entrar na página e percorrê-la da direita para a esquerda ou em sentido contrário, como um letreiro. Isso é obtido usando-se a formatação Marquee.
O código é: <marquee>Texto que deve se movimentar</marquee>.
Esse comando admite atributos de direção e largura do efeito as quais possibilitam várias formas de apresentação.
Também pode-se aplicar cores, negrito, italic e alterar a fonte e o seu tamanho, normalmente.
O deslocamento pode ser só da direita para a esquerda:
Exemplo 3: Acima foi utilizado: <span style="color: rgb(255, 0, 0);"><marquee behavior=scroll>Tô nem aí!</marquee></span>
Pode ser utilizada uma imagem:
Acima foi utilizado: <marquee behavior="alternate"><img src="../fig/estrel01.gif"></marquee>
O atributo behavior="alternate" faz com que o elemento movimentado vá e volte.
Exemplo 4: Veja um exemplo de uso do tag Marquee com uma foto grande, clicando aqui.
Outros exemplos:
1. Interferindo na direção:
a. Da esquerda para a direita. O atributo slide direction="right" faz com que o elemento siga para a direita.
<marquee behavior=slide direction=right>Elemento que se movimenta</marquee>
Exemplo 5: Acima foi utilizado: <marquee style="font-family: arial;" slide direction="right"><span style="color: rgb(255, 160, 120);">A gente somos inútil!</span></marquee>
b. Da direita para a esquerda. O atributo slide direction="left" faz com que o elemento siga para a esquerda.
<marquee behavior=slide direction=left>Elemento que se movimenta</marquee>
Exemplo 6: Acima foi utilizado: <marquee style="font-family: arial;" slide direction="left"><span style="color: rgb(0, 190, 255);">Por
isso corro demais: só pra te ver, meu bem!</span></marquee>
2. Interferindo na velocidade:
A especificação scrollDelay=um número indica a velocidade da rolagem: quanto menor for o número, mais rapidamente o texto corre. Exemplos:
Exemplo 7: Acima foi utilizado: </marquee><marquee scrolldelay="300"><img src="../fig/estrel01.gif"></marquee>
Exemplo 8: Acima foi utilizado: <marquee scrollDelay=50><img src="../fig/estrel01.gif"></marquee>
Se o que vai se movimentar é um texto evidentemente ele pode ser formado: Cor, tipo e tamanhos de fonte etc.
Acima foi utilizado: <marquee scrollDelay=150><font color=#00FF7F>Tomara que você volte depressa!</em></font></marquee>
3. Interferindo no sentido:
A especificação direction=up faz com que o texto fique na vertical. Nesse caso foi também centralizado e aparece na cor lilás (MediumSlateBlue). Exemplo:
Exemplo 9: Acima foi utilizado: <marquee direction=up <P align="center"><center> <font color=#7B68EE>Subindo!</font></p></marquee>