Início
Loja
Hoje vamos aprender a movimentar objetos em uma pagina html.
Sabe aqueles textos que se movimentam de um lado para o outro, como um letreiro digital? Hoje vamos aprender a fazer!
É muito simples, basta utilizar a tag:
- Código:
<marquee>TEXTO</marquee>
Vamos ver um exemplo:
- Código:
<html>
<head>
<title> WASD Fórum </title>
</head>
<body>
</marquee>Este texto aparecerá na tela do computador movimentando-se da direita para a esquerda como um letreiro digital</marquee>
</body>
</html>
Note que o texto fica entre as tags
- Código:
<marquee> e </marquee>
Tudo o que estiver entre essas duas tags, vai se movimentar. Você, além de movimentar textos, pode também, movimentar imagens.
Veja um exemplo:
- Código:
<marquee>
<img src=”imagem.jpg”>
</marquee>
Nesse caso a figura “imagem.jpg” ira se movimentar na tela da direita pra esquerda, constantemente e sem parar, igual a um letreiro digital, só que em vez de texto, uma imagem vai de mexer.
Há alguns atributos úteis da tag marquee. Um dos mais interessantes é o de direção. Você pode definir pra qual direção seu objeto (texto ou imagem) vai se movimentar, pode ser pra esquerda, pra direita, pra cima ou pra baixo. Por padrão o movimento é da direita pra esquerda.
veja um exemplo:
- Código:
<marquee direction=”right”>
Este texto vai se mexer da esquerda pra direita.
</marquee>
As opções de direction são:
- “right”, da esquerda para direita;
- “left” vice-versa da anterior;
- “up”, de baixo pra cima e
- “down” de cima pra baixo.
Há também outros atributos como velocidade:
- Código:
<marquee scrolldelay="45" truespeed>...</marquee>
onde no valor de scrolldelay você coloca a velocidade em milissegundos, nesse caso coloca-se “truespeed” para validar o atributo.
Até a próxima.
Créditos:
Kennedy Lucas - Pelo tutorial.
iLucas - Por trazer o conteúdo para a Wasd Fórum.
