Temporização com JavaScript

No ambiente web temporizadores (timers) são usados pra de tempos em tempos recarregar automaticamente as páginas.

Por exemplo, em intersítios que mostram cotações (não em tempo real) de bolsa de valores costumam ser atualizadas a cada 15 minutos pro internauta.

O exemplo abaixo mostra o horário a cada 1 segundo.
A rotina SetInterval informa o navegador pra ficar recarregando determinada rotina a certo intervalo de tempo (em milisegundos).


  Exemplo  
<html>
  <head>
    <script type="text/javascript">
      function Temporizar ()

      {
        var DataHora;

        DataHora     = new Date ();
        Relogio.value= DataHora.toLocaleTimeString ();
      }

      function Inicializar (Intervalo_MSeg)

      {
        Temporizar ();
        setInterval (Temporizar, Intervalo_MSeg);
      }
    </script>
  </head>
  <body onload="Inicializar (1000)">
    Horário: <input type="text" id="Relogio" style="color: Navy">
  </body>
</html>
Abrir no navegador




Chateações com JavaScript

Os temporizadores também costumam ser usados pra fazer aqueles banners de chateação que ficam acompanhando o rolamento das páginas.
Nesse exemplo SetInterval inicia a temporização e ClearInterval para.


  Exemplo   
<html>
   <head>
      <script type="text/javascript">
         var Sinal, Temporizador;

         Sinal       = true;
         Temporizador= "";

         function Temporizar ()

         {
            if (parseInt (Scramble.style.top) + 35 >= 400)
               Scramble.style.top= 80;
            else
               Scramble.style.top= parseInt (Scramble.style.top) + 10;

            if (Sinal)
               Scramble.style.left= 260;
            else
               Scramble.style.left= 300;

            Sinal= !Sinal;
         }

         function Inicializar (Intervalo_MSeg)

         {
            if (Temporizador == "") {
               Temporizar ();
               Temporizador= setInterval (Temporizar, Intervalo_MSeg);
            }
         }

         function Finalizar ()
         
         {
            if (Temporizador != "") {
               clearInterval (Temporizador);
               Temporizador= "";
            }
         }

      </script>
   </head>
   <body onload="Inicializar (150)">
      <input type="button" id="Inicio" value="Iniciar" onclick="Inicializar (150)">
      <br><br>
      <input type="button" id="Fim" value="Parar" onclick="Finalizar ()">
      <br>
<span id="Scramble" style="background-color:Red; position:absolute; top:80px; left:260px; height:35px">
   !!!O terrível e odioso Scramble!!!
</span>
   </body>
</html>
Abrir no navegador





http://transeberiano.brinkster.net