none
Contagem Regressiva em Javascript RRS feed

 > 

  • Pergunta

  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Alguém teria um script de um contador regressivo, tipo quero informar a hora, os minutos e os segundos e quero que esse relógio faça a contagem regressiva, achei muitos na internet mais com dia, mês e ano e não estou conseguindo adptá-los já que não sei muita coisa de JS, alguém poderia me ajudar???

     

    []'s

     

    Rafael

    sexta-feira, 28 de março de 2008 17:57
    |

Respostas

  • Question
    Entrar para Votar
    2
    Entrar para Votar

    Galera dá uma olhada nesse site

    Dá uma olhada nesse site...

     

    http://blog.bluesam.com/2008/07/count-down-aspnet-user-control.html

     

    Abraço

    Se for útil marcar como resposta Para que outros Aproveitem
    https://www.virtualbase.com.br


    sábado, 18 de dezembro de 2010 12:00
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    meu amigo segue o exemplo que voce pediu .

     

    nele o usuario entra com uma hora, e caso ela seja menor que a hora atual o script vai considerar essa hora para o dia seguinte.

     

    Caso voce queira que ele considere uma hora que ja se passou tem que fazer tratamentos especiais...

     

     

    mas do jeito que esta, calcula a hora que falta da hora altual para a hora desejada....

     

     

     

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    <html>

    <head>

    <title>Contagem regressiva</title>

    <script type="text/javascript">

    var HH = 23;

    var MI = 59;

    var SS = 59;

    function atualizaContador() {

    var hoje = new Date();

    var todayd= hoje.getDate();

    var todaym= hoje.getMonth();

    var todayy= hoje.getFullYear();

    var futuro = new Date(todayy,todaym+1,todayd,HH,MI,SS);

    var ss = parseInt((futuro - hoje) / 1000);

    var mm = parseInt(ss / 60);

    var hh = parseInt(mm / 60);

    var dd = parseInt(hh / 24);

    ss = ss - (mm * 60);

    mm = mm - (hh * 60);

    hh = hh - (dd * 24);

    var faltam = '';

    faltam += (toString(hh).length) ? hh+' hr, ' : '';

    faltam += (toString(mm).length) ? mm+' min e ' : '';

    faltam += ss+' seg';

    if (dd+hh+mm+ss > 0) {

    document.getElementById('contador').innerHTML = faltam;

    setTimeout(atualizaContador,1000);

    } else {

    document.getElementById('contador').innerHTML = 'CHEGOU!!!!';

    setTimeout(atualizaContador,1000);

    }

    }

    </script>

    </head>

    <body onload="atualizaContador()">

    <h3>Contagem regressiva</h3>

    <p>Relação entre a hora atual e a hora que o usuario deseja calcular</p>

    <p>Atualiza automaticamente, basta inserir a hora.</p>

    <input onchange="HH=this.value" size="1" value="23" style="text-align:center" /> :

    <input onchange="MI=this.value" size="1" value="59" style="text-align:center" /> :

    <input onchange="SS=this.value" size="1" value="59" style="text-align:center" />

    <br />

    Faltam <span id="contador"></span>

    </body>

    </html>

     

     

     

    Abraços...

     

    tomara que sirva...

     

    terça-feira, 1 de abril de 2008 02:32
    |

Todas as Respostas

  • Question
    Entrar para Votar
    0
    Entrar para Votar
    Up....alguém???

     

    segunda-feira, 31 de março de 2008 17:36
    |
  • Question
    Entrar para Votar
    2
    Entrar para Votar

    Cara essa é uma função que eu usei uma vez, ela conta quanto tempo falta para uma determinada data

    var YY = 2007;
    var MM = 12;
    var DD = 31;
    var HH = 23;
    var MI = 59;
    var SS = 59;

    function atualizaContador() {
          var hoje = new Date();
          var futuro = new Date(YY,MM-1,DD,HH,MI,SS);

          var ss = parseInt((futuro - hoje) / 1000);
          var mm = parseInt(ss / 60);
          var hh = parseInt(mm / 60);
          var dd = parseInt(hh / 24);

      ss     = ss - (mm * 60);
      mm     = mm - (hh * 60);
      hh     = hh - (dd * 24);

          var faltam = '';
      faltam     += (dd && dd > 1) ? dd+' dias, ' : (dd==1 ? '1 dia, ' : '');
      faltam     += (toString(hh).length) ? hh+' hr, ' : '';
      faltam     += (toString(mm).length) ? mm+' min e ' : '';
      faltam     += ss+' seg';

          if (dd+hh+mm+ss > 0) {
        document    .getElementById('contador').innerHTML = faltam;
        setTimeout    (atualizaContador,1000);
          } else {
        document    .getElementById('contador').innerHTML = 'CHEGOU!!!!';
        setTimeout    (atualizaContador,1000);
          }
    }

     

     

    Segue para voce testar

     

     

    <body onload="atualizaContador()">
    <input size="1" onchange="DD=this.value" style="text-align: center" /> /
    <input size="1" onchange="MM=this.value" style="text-align: center" /> /
    <input size="4" onchange="YY=this.value" style="text-align: center" /> às
    <input size="1" onchange="HH=this.value" style="text-align: center" /> :
    <input size="1" onchange="MI=this.value" style="text-align: center" /> :
    <input size="1" onchange="SS=this.value" style="text-align: center" />
    <br />
    Faltam     <span id="contador"></span>
    </body>

     

     

     

     

     

    • Sugerido como Resposta Jones Roberto sábado, 18 de dezembro de 2010 12:01
    segunda-feira, 31 de março de 2008 17:42
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Leandro, obrigado pela resposta, mais eu já vi esse script na net, e como disse não consegui adaptá-lo, eu quero somente que o usuário possa entrar com minutos e segundo e no máximo horas, e não uma data completa, conseguiria me ajudar???

     

    []´s

     

    Rafael

     

    segunda-feira, 31 de março de 2008 18:01
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

     

    Voce pode usar esse mesmo, e esconder os campos de datas, e quando o usuario entrar com a data e hora voce assume os campos de datas como a data atual.;.

     

     

    Sacou !?

     

    Se sempre for ser regressivo para o mesmo dia, o usuario entra com as horas e voce coloca a data como a data atual...

     

     

     

    segunda-feira, 31 de março de 2008 18:09
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Blz, boa idéia, vou testar aqui, e volto pra marcar como resposta se ficar legal.

    segunda-feira, 31 de março de 2008 18:33
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar
    Fiz o que voc falou e eu caio sempre no else, não sei pq, sempre ele mostra "CHEGOU!!!!!" o que eu faço Leandro???

     

    Eu entendi como esse script trabalho e não serve para mim, pois o meu usuário deve entrar com qualquer hora e minuto e segundo.

     

    Eu fazendo pelo jeito que você sugeriu, se eu colocar uma hora (que é obrigado a colocar senão não funciona) que já tenha passado no dia, por exemplo 17:30 e são 19:00 agora ele não funciona, pq ele pega a data atual e uma data futura no dia.

     

    No script que quero o usuário entra lá com hora, minuto e segundo, ou apenas minuto e segundo e faz a contagem regressiva, com esse script eu não vou conseguir isso.

     

    Teria como adaptá-lo??? poderia me ajudar???

    []´s

     

    Rafael

    segunda-feira, 31 de março de 2008 19:16
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    meu amigo segue o exemplo que voce pediu .

     

    nele o usuario entra com uma hora, e caso ela seja menor que a hora atual o script vai considerar essa hora para o dia seguinte.

     

    Caso voce queira que ele considere uma hora que ja se passou tem que fazer tratamentos especiais...

     

     

    mas do jeito que esta, calcula a hora que falta da hora altual para a hora desejada....

     

     

     

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

    <html>

    <head>

    <title>Contagem regressiva</title>

    <script type="text/javascript">

    var HH = 23;

    var MI = 59;

    var SS = 59;

    function atualizaContador() {

    var hoje = new Date();

    var todayd= hoje.getDate();

    var todaym= hoje.getMonth();

    var todayy= hoje.getFullYear();

    var futuro = new Date(todayy,todaym+1,todayd,HH,MI,SS);

    var ss = parseInt((futuro - hoje) / 1000);

    var mm = parseInt(ss / 60);

    var hh = parseInt(mm / 60);

    var dd = parseInt(hh / 24);

    ss = ss - (mm * 60);

    mm = mm - (hh * 60);

    hh = hh - (dd * 24);

    var faltam = '';

    faltam += (toString(hh).length) ? hh+' hr, ' : '';

    faltam += (toString(mm).length) ? mm+' min e ' : '';

    faltam += ss+' seg';

    if (dd+hh+mm+ss > 0) {

    document.getElementById('contador').innerHTML = faltam;

    setTimeout(atualizaContador,1000);

    } else {

    document.getElementById('contador').innerHTML = 'CHEGOU!!!!';

    setTimeout(atualizaContador,1000);

    }

    }

    </script>

    </head>

    <body onload="atualizaContador()">

    <h3>Contagem regressiva</h3>

    <p>Relação entre a hora atual e a hora que o usuario deseja calcular</p>

    <p>Atualiza automaticamente, basta inserir a hora.</p>

    <input onchange="HH=this.value" size="1" value="23" style="text-align:center" /> :

    <input onchange="MI=this.value" size="1" value="59" style="text-align:center" /> :

    <input onchange="SS=this.value" size="1" value="59" style="text-align:center" />

    <br />

    Faltam <span id="contador"></span>

    </body>

    </html>

     

     

     

    Abraços...

     

    tomara que sirva...

     

    terça-feira, 1 de abril de 2008 02:32
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar
    muito bom esse código! parabéns....abraço!
    quinta-feira, 10 de junho de 2010 00:33
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    muito bom o codigo,

    mais precisa de uma ajuda,

    tenho q fazer uma contagem regressiva,

    aqui cada linha da minha tabela é uma avaliação de cliente, e cada linha e um prazo diferente,

    precisava que tivesse um contador em cada linha,

    sera q alguem tem uma ideia de como fazer?

     

    no aguardo

    segunda-feira, 19 de julho de 2010 18:39
    |
  • Question
    Entrar para Votar
    0
    Entrar para Votar

    Leando, muito boa sua função!

    Me resolveu um problemão... 

    Valew cara!!

    sexta-feira, 17 de dezembro de 2010 07:41
    |
  • Question
    Entrar para Votar
    2
    Entrar para Votar

    Galera dá uma olhada nesse site

    Dá uma olhada nesse site...

     

    http://blog.bluesam.com/2008/07/count-down-aspnet-user-control.html

     

    Abraço

    Se for útil marcar como resposta Para que outros Aproveitem
    https://www.virtualbase.com.br


    sábado, 18 de dezembro de 2010 12:00
    |