Fórum Fazer contador de dias #3612
13/03/2009
0
Bom dia,
Preciso construir um contador de dias, ou seja, ele começa hoje , e vai marcando quantos dias faltam para o lançamneto, assim :
Faltam 15 dias para iniciar, e a cada dia tem que ir diminuindo até começar contar as horas... ou seja, faltam 10H e 40 M para iniciar....
Como eu posso fazer isso?
Preferencialmente em C# ou Javascript que acho até que é melhor pois posso chamar sem o uso do asp.net .
Valew
Regis
Régis Mello
Curtir tópico
+ 0
Responder
Posts
13/03/2009
[devmedia .net]
Olá Régis, tudo bem ?
Eu fiz um contador desses semana passada...
Segue o código pronto.. copie e cole..
para alterar o valor da data futura altere a propriedade value dos controles textbox <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Contagem regressiva</title> <script type="text/javascript"> var YY = 2009; 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); } } </script> </head> <body onload="atualizaContador()"> <h3> Contagem regressiva em javascript</h3> <p> Este exemplo exibe quando tempo falta para uma determinada data.</p> <p> Altere os campos abaixo para que o contador regressivo se atualize automaticamente.</p> <input onchange="DD=this.value" size="1" value="31" style="text-align: center" /> / <input onchange="MM=this.value" size="1" value="12" style="text-align: center" /> / <input onchange="YY=this.value" size="4" value="2009" style="text-align: center" /> …s <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 Carlos Jr
para alterar o valor da data futura altere a propriedade value dos controles textbox <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Contagem regressiva</title> <script type="text/javascript"> var YY = 2009; 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); } } </script> </head> <body onload="atualizaContador()"> <h3> Contagem regressiva em javascript</h3> <p> Este exemplo exibe quando tempo falta para uma determinada data.</p> <p> Altere os campos abaixo para que o contador regressivo se atualize automaticamente.</p> <input onchange="DD=this.value" size="1" value="31" style="text-align: center" /> / <input onchange="MM=this.value" size="1" value="12" style="text-align: center" /> / <input onchange="YY=this.value" size="4" value="2009" style="text-align: center" /> …s <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 Carlos Jr
Responder
Gostei + 0
13/03/2009
Régis Mello
Eu preciso fazer isso ai, colocar um contador na página para mostrar quantos dias faltam, o código que você me passou funciona ok, mas eu não sei como aumentar o tamanho da letra e tirar aquele campo para ficar preenchendo a data, não tem interação com o usuário, é apenas a página retornando quantos dias faltam.... se não der a hora tudo bem, os dias precisam retornar, preferencialmente em imagem, mas se não der para me passar algo assim tudo bem, estou aprendendo mesmo, eu chego lá.
Att
Regis
Responder
Gostei + 0
13/03/2009
[devmedia .net]
Régis,
Eu passei o código pronto para você,
você só tem que alterar o HTML e aumentar a letra como desejar...
Você me solicitou um código para fazer contagem regressiva, e não falou que deveria ser com imagem,
sua solicitação foi atendida, lhe enviei um código pronto comentado para que você pudesse alterar da maneira que quiser, não estou entendendo o que quer dizer com isso então...
Pois o código é de simples entendimento, e fácil alteração..
Basta colocar na sua página que aumentar como quiser, isso é HTML básico.
Me desculpe, mas não tem como ser mais objetivo e claro como a minha primeira resposta,
sinceramente não sei o que você quer.
Abraços
Carlos Jr
Responder
Gostei + 0
13/03/2009
Devmedia
Régis,
peço que grave sua dúvida em video e responda ao consultor com a mesma. Após esse procedimento, o consultor fará o mesmo, a fim de sanar por completo sua dúvida.
Peço que, ao gravar o video, forneça o máximo de informações ao consultor, seja detalhista, pois o mesmo não conhece o seu sistema como vc.
Se não souber como gravar esse video, tire suas dúvidas em
https://www.devmedia.com.br/marcadores/abrir_chamado_video/video%20como%20abrir%20chamado%20com%20video.htm
Desde já agradecemos pela sua compreensão.
peço que grave sua dúvida em video e responda ao consultor com a mesma. Após esse procedimento, o consultor fará o mesmo, a fim de sanar por completo sua dúvida.
Peço que, ao gravar o video, forneça o máximo de informações ao consultor, seja detalhista, pois o mesmo não conhece o seu sistema como vc.
Se não souber como gravar esse video, tire suas dúvidas em
https://www.devmedia.com.br/marcadores/abrir_chamado_video/video%20como%20abrir%20chamado%20com%20video.htm
Desde já agradecemos pela sua compreensão.
Responder
Gostei + 0
13/03/2009
Régis Mello
Ok, desculpe-me se não tenho video para enviar, desculpe-me se eu estou aprendendo, desculpe-me se não sei mudar a letra, desculpe-me, mas no futuro se for pensar em ser grosso faça a gentileza de não responder ao post, eu sei que você não tem uma visão completa do meu sistema, mas espero que saiba que estou aprendendo e quero aprender fazendo algo que gosto, estou tentando dar o meu melhor, me esforçando para ser compreendido, mas até alguns dias atras nunca tinha ouvido falar em c#, asp.net, javascript e outras tantas coisas, sou ecomista, tenho 44 anos e estou aprendendo, me esforço para fornecer o meu melhor, portanto, me desculpe se não sou bom o bastante para ser seu aluno ou seja lá que nome vocês dão.
Att
Regis
Responder
Gostei + 0
13/03/2009
[devmedia .net]
Régis, em nenhum momento que quis ser grosso...
Talvez eu tenha usado palavras erradas, mas não quero que o chamado vire disussão..
Estamos aqui para resolver suas dúvidas, mas para isso precisamos saber o que exatamente tem em mente no que quer fazer.
Você me enviou uma dúvida e eu a respondi, com objetividade como costumo fazer com todos os chamados,
você me pediu um contador regressivo, e eu lhe dei um código pronto do mesmo.
Sobre você não conhece a plataforma .net , tudo bem, ninguém nasce sabendo, mas para começar no desenvolvimento WEB precisamos compreender algumas coisas que são necessárias para isso.
Estou lhe enviando um curso de introdução ao .net do Pedro Bajotto,
é um curso bem bakana, simples e de fácil compreesão.
https://www.devmedia.com.br/cursos/listcurso.asp?curso=66 Caso não tenha acesso ao curso, por favor me fale que lhe daremos o acesso, peço que você veja o curso, e caso tenha alguma dúvida pode entrar em contato conosco.
Como lhe disse, estamos todos empenhados em resolver suas dúvidas, mas não podemos fazer todo o código para você, espero que entenda, nossa função é ajudar em algum objetivo traçado.
Tenho muito prazer em ajudar, mas antes de começar precisamos saber o nível em que se encontra, para que possamos direcionar as respostas de acordo com seu conhecimento.
Como você mesmo disse, não tem conhecimento em HTML, que é um assunto essencial para o desenvolvimento WEB. Para mim não importa se está iniciando agora em .net, eu quero é lhe ajudar e terei prazer e orgulho em fazer isso. Conte sempre comigo e com a DevMedia para lhe ajudar.
Peço novamente desculpas por ter usado palavras erradas,
e me diga o que precisa que tentarei lhe atender com a maior atenção. Abraços
Carlos Jr
Você me enviou uma dúvida e eu a respondi, com objetividade como costumo fazer com todos os chamados,
você me pediu um contador regressivo, e eu lhe dei um código pronto do mesmo.
Sobre você não conhece a plataforma .net , tudo bem, ninguém nasce sabendo, mas para começar no desenvolvimento WEB precisamos compreender algumas coisas que são necessárias para isso.
Estou lhe enviando um curso de introdução ao .net do Pedro Bajotto,
é um curso bem bakana, simples e de fácil compreesão.
https://www.devmedia.com.br/cursos/listcurso.asp?curso=66 Caso não tenha acesso ao curso, por favor me fale que lhe daremos o acesso, peço que você veja o curso, e caso tenha alguma dúvida pode entrar em contato conosco.
Como lhe disse, estamos todos empenhados em resolver suas dúvidas, mas não podemos fazer todo o código para você, espero que entenda, nossa função é ajudar em algum objetivo traçado.
Tenho muito prazer em ajudar, mas antes de começar precisamos saber o nível em que se encontra, para que possamos direcionar as respostas de acordo com seu conhecimento.
Como você mesmo disse, não tem conhecimento em HTML, que é um assunto essencial para o desenvolvimento WEB. Para mim não importa se está iniciando agora em .net, eu quero é lhe ajudar e terei prazer e orgulho em fazer isso. Conte sempre comigo e com a DevMedia para lhe ajudar.
Peço novamente desculpas por ter usado palavras erradas,
e me diga o que precisa que tentarei lhe atender com a maior atenção. Abraços
Carlos Jr
Responder
Gostei + 0
13/03/2009
Luiz Maia
Regis,
Qual sua duvida neste chamado?
Estou aguardando
Abraços
Att
Luiz Maia
Responder
Gostei + 0
13/03/2009
Régis Mello
Eu preciso fazer um contador de dia em uma página, igual ao que aparece na imagem, ele conta quantos dias faltam para uma determinada data, pode ser em C# , ou javascript, tanto faz, mas ele fica contando os dias e no final ele conta as horas, ou seja, no último dia que faltar ele começar contar, faltam tantas horas para chegar é isso. Eu não sei como fazer isso, mas eu quero aprender, ou seja quero entender o que estou fazendo.
Na imagem para vc ter uma idéia do que estou tentando fazer, já sei trabalhar com datas na stored procedure, ajudou muito seu post sobre o assunto, fiz vários testes e já estou entendo bem, mas ainda não sei como trabalhar com datas na página.
Att
Regis
Responder
Gostei + 0
13/03/2009
Luiz Maia
Ola Regis,
Fiz toda a codificação para vc neste componente, siga os passos para testar:
Copie todo o codigo abaixo;
Cole num arquivo .txt (bloco de notas);
Renomei o arquivo para teste.html;
Salve em qualquer lugar de sua maquina;
Dê dois cliques no arquivo para abrir o browser;
Depois abra o arquivo usando o Visual Studio
Altere a data de expiração e atualize a pagina para verificar se a contagem esta correta.
Segue abaixo o print da tela que montei, ajuste de acordo com o seu layout.
Todo o codigo foi feito usando HTML, CSS e JAVASCRIPT, portanto é um codigo cliente, não necessita ir no servidor para executar.
Segue a imagem:
Agora o codigo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Contagem regressiva</title>
<script type="text/javascript">
// AQUI VC COLOCA A DATA DE EXPIRAۂO
// tambem pode ser setada via codigo
// mude o dia para o dia de hoje e vera que passara a falar as horas.
var dataExpiracao = "13/03/2009";
// pega o ano da data de expira‡Æo
var YY = dataExpiracao.substring(6, 10);
// pega o mes da data de expira‡Æo
var MM = dataExpiracao.substring(4, 5);
// pega o dia da data de expira‡Æo
var DD = dataExpiracao.substring(0, 2);
// pega ultima hora, minuto e segundo da data de expira‡Æo
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 = '';
var diahora = '';
faltam = (dd && dd) >= 1 ? dd : '';
diahora = (dd > 1) ? 'dias' : 'dia';
if (dd == 0)
{
faltam = (toString(hh).length) ? hh : '';
if (hh == 1)
diahora = 'hora';
else
diahora = 'horas';
}
if (dd + hh + mm + ss > 0)
{
document.getElementById('spTitulo').innerHTML = "Faltam";
document.getElementById('spHoraDia').innerHTML = diahora + "<br /><font size=2> para sua promo‡Æo acabar</font>";
document.getElementById('spContador').innerHTML = faltam;
setTimeout(atualizaContador,1000);
}
else
{
document.getElementById('spTitulo').innerHTML = "CHEGOU!!!!";
document.getElementById('spHoraDia').innerHTML = " hj o dia para sua promo‡Æo acabar";
document.getElementById('spContador').innerHTML = "0";
setTimeout(atualizaContador,1000);
}
}
</script>
<style type="text/css">
.style1
{
font-size: large;
color: #FFFFFF;
}
.style2
{
font-size: xx-large;
color: #FFFFFF;
}
</style>
</head>
<!-- aqui chama o metodo de contador que se chama "atualizaContador" -->
<body onload="atualizaContador()">
<table cellpadding="3" cellspacing="3" style="background-color:Black;">
<tr>
<td colspan="2" class="style1"><span id="spTitulo"></span></td>
</tr>
<tr>
<td><span id="spContador" class="style2"></span></td>
<td><span id="spHoraDia" class="style1"></td>
</tr>
</table>
</body>
</html>
Se preferir, pode pegar o arquivo ja pronto no endereço abaixo:
http://video.devmedia.com.br/naoexclusivo/LuizMaia/Consultoria/regis01.zip
É so descompactar e clicar duas vezes no arquivo HTML.
Abraços
Att
Luiz Maia
Responder
Gostei + 0
13/03/2009
Régis Mello
Muito obrigado, funcionou perfeitamente.
Valeu mesmo!
Regis
Responder
Gostei + 0
Clique aqui para fazer login e interagir na Comunidade :)