PDF download Baixe em PDF PDF download Baixe em PDF

Os textos que piscam na verdade nunca fizeram parte das funções padrões do HTML, e não há nenhuma forma usada para conseguir esse efeito que funcione em todos os navegadores. A melhor opção que usa somente HTML é a tag “marquee”, mas ela não funciona com o Google Chrome. Usar JavaScript é um método mais confiável, e você pode copiar e colar o código diretamente no seu documento HTML.

Método 1
Método 1 de 2:

Usando a tag marquee

PDF download Baixe em PDF
  1. Essa tag está obsoleta, e seu uso por desenvolvedores é fortemente desencorajado. Os textos com essa tag são exibidos de forma diferente dependendo do navegador utilizado, e as futuras atualizações podem até mesmo impedir que o texto pisque. [1] [2] Aprenda a usar o Javascript caso esteja criando um site profissional.
    • O Google Chrome não tem suporte ao atributo "scrollamount" que esse método utiliza. [3] No Chrome, o texto vai rolar pela página em vez de piscar.
  2. Abra o documento HTML em um editor de texto simples. Digite <marquee> no começo do texto. Digite </marquee> no final do texto.
    • Assim como com qualquer outro documento HTML, é necessário escrever as tags básicas primeiro: <html>, <head>, e <body>.
  3. Altere a tag inicial para <marquee width="300" >. Isso não vai mudar o tamanho da fonte. Há dois motivos pelos quais talvez seja necessário alterar a largura:
    • Caso o texto não caiba, ele vai ficar rolando em vez de piscar. Aumente a largura para evitar que isso aconteça.
    • No Chrome, o texto rolará por uma distância determinada pela largura.
  4. Dentro da mesma tag, escreva scrollamount="300" (ou qualquer que seja o valor escolhido para a largura). Por padrão, o texto vai ficar rolando na página. Ao definir o “scrollamount” como tendo o mesmo número que a largura, o texto irá "rolar" na mesma posição em que ele está. Isso faz com que o texto pisque.
    • Seu texto deve parecer com algo do tipo:
      <marquee width="300" scrollamount="300">Texto aqui.</marquee>.
  5. Abra o arquivo HTML em um navegador para ver o efeito. Caso o texto esteja piscando muito rápido ou muito devagar, altere a velocidade com o atributo scrolldelay="500" . O valor padrão é 85. [4] Use um número maior para o texto piscar mais lento, ou um número menor para piscar mais rápido.
    • O código agora deve se parecer com o seguinte exemplo:
      <marquee width="300" scrollamount="300" scrolldelay="500">Texto aqui.</marquee>
  6. Muitos usuários acham que os textos piscando nas páginas são irritantes. Para interromper o efeito depois de já ter chamado a atenção do leitor, digite loop="7" . Agora o texto vai piscar apenas sete vezes e desaparecer. (Você pode alterar o “7” para qualquer outro número que preferir).
    • O código completo é o seguinte:
      <marquee width="300" scrollamount="300" scrolldelay="500" loop="7">Texto aqui.</marquee>
    Publicidade
Método 2
Método 2 de 2:

Usando JavaScript

PDF download Baixe em PDF
  1. Entre as tags <head> e </head> do documento HTML, insira o seguinte código JavaScript: [5]
    • function pisca() {
        var f = document.getElementById('anuncio');
        setInterval(function() {
          f.style.visibility = (f.style.visibility == 'hidden' ? '' : 'hidden');
        }, 1000);
      }
  2. O código acima definiu uma função com o nome "pisca". Para usar essa função no seu HTML, altere a tag <body> para <body onload="pisca();">.
  3. O script vai afetar apenas os elementos com o id "anuncio". Coloque seu texto piscante dentro de qualquer elemento e use esse id. Por exemplo, digite <p id="anuncio">Texto aqui.</p> ou <div id="anuncio">Texto aqui.</div>.
    • Você pode colocar o nome de sua preferência. Apenas lembre de usar a mesma palavra no script e no id do elemento.
  4. O número "1000" no script define o tempo entre cada piscada. O valor está em microssegundos, então um valor de 1000 faz o texto piscar uma vez por segundo. [6] Use um número menor para fazer o texto piscar mais rápido, ou um número maior para piscar mais devagar.
    • O tempo real provavelmente não vai ser exatamente esse valor. Ele costuma ser ligeiramente mais curto, mas pode levar mais tempo caso o navegador esteja ocupado com outros processos.
    Publicidade

Dicas

  • É possível ajustar a aparência do texto com o atributo “style”. Adicione o texto: style="border:solid".
  • Pode ser incluído um atributo de altura e de largura dentro da tag marquee, mas muitos navegadores vão ignorar o comando. [7] É possível perceber a diferença caso tenha adicionado uma borda.
  • Você também pode usar animações com CSS para fazer o texto piscar. Fazer isso é bastante complicado e não é recomendado para iniciantes no CSS. Tenha em mente que será necessário vincular um documento CSS, já que o Firefox não tem suporte para animações CSS por padrão. [8]
Publicidade

Avisos

  • Não use a tag <blink> ou a decoração de texto do CSS, já que poucos navegadores modernos oferecem suporte a eles. [9] [10]
Publicidade

Sobre este guia wikiHow

Esta página foi acessada 37 097 vezes.

Este artigo foi útil?

Publicidade