Bom Dia Galera!
Willian Bruno e itlpps, obrigado pela resposta de vocês. Willian Bruno visualizei o seu código e achei interessante, mas como tenho pouco conhecimento em javascript não consegui compreender em parte o seu código. Achei um outro código aqui na internet e ele está funcional, só que surgiu uma pequena dúvida. Segue o código abaixo:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Contagem Regressiva</title>
<script type="text/javascript">
var tempo = new Number();
tempo = 15; //TEMPO DADO EM SEGUNDOS. AQUI É LIVRE PARA MANIPULÁ-LO.
function ContagemRegressiva(){
if(tempo >= 0){
var minutos = parseInt(tempo / 60);
var horas = parseInt(minutos / 60);
minutos = (minutos % 60);
var segundos = (tempo % 60);
if(horas < 10){
horas = '0' + horas;
horas = horas.substr(0,2); //-->
}
if(minutos < 10){
minutos = '0' + minutos;
minutos = minutos.substr(0,2); //-->
}
if(segundos < 10){
segundos = '0' + segundos;
}
setTimeout('ContagemRegressiva()',1000);
tempo--;
regressivo.innerHTML = horas + '<font color=#000>:</font>' + minutos + '<font color=#000>:</font>' + segundos;
if((horas == 00) && (minutos == 00) && (segundos == 00)){
regressivo.innerHTML = horas + '<font color=#000>:</font>' + minutos + '<font color=#000>:</font>' + segundos + '<font color=#250202><br />Tempo Finalizado!</font>';
}
}
else{
//AQUI FAREI O REDIRECIONAMENTO
}
}
ContagemRegressiva();
</script>
</head>
<body>
<!--<p id="regressivo"></p>-->
<h2 align="center"><font color="#065ca5" face="tahoma">Contagem Regressiva</font></h2>
<hr color="#065ca5" width="100">
<div align="center">
<b><font color=#ff0000 size=2 face=arial><span id="regressivo"></span></font></b><br>
</div>
</body>
</html>
A minha dúvida aqui é onde está marcado //--> com duas barras, dois traços e uma setinha pra frente.
if(horas < 10){
horas = '0' + horas;
horas = horas.substr(0,2); //-->
//horas = horas.substr(0,2); //-->
}
Reescrevi o código para melhor visualização. Minha pergunta é o seguinte é necessário ter esta linha do horas = horas.substr(0,2), porque ele tanto comentado como descomentado o tempo aparece para min assim: 00:00:15 e vai decrementando. Fiz uma alteração no código só por questão de apresentação na tela do usuário. Segue a parte do código abaixo:
if((horas == 00) && (minutos == 00) && (segundos == 00)){
regressivo.innerHTML = horas + '<font color=#000>:</font>' + minutos + '<font color=#000>:</font>' + segundos + '<font color=#250202><br />Tempo Finalizado!</font>';
}
Quero saber na opinião de vocês se esta parte do código que acrescentei está coerente. Na verdade estou usando este código juntamente com o PHP através de sessões. Por exemplo no PHP defini o tempo de 20 minutos para o usuário que está logado, só que quero mostrar para o usuário o tempo restante que ele tem. Já que no PHP o tempo fica estático e no javascript ele é dinâmico e se caso o usuário dar um refresh na página ele volta para o tempo de 20 minutos e vai decrementando até ele dar um novo refresh ou a sessão dele expirar. Do lado do client-server deixei tudo validado se caso client-side estiver desabilitado. Após ter feito isto, vou fazer um novo script para que mostre na tela do usuário o tempo total que ele ficou na página, tudo isto dinamicamente. O meu objetivo é o seguinte, durante o tempo de sessão do usuário quero mostrar o tempo progressivo e o tempo regressivo. Desde já, agradeço pela cooperação de todos!