Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Apenas Eu

Formato da contagem regressiva

Por , em Javascript

Recommended Posts

Apenas Eu    13

Apenas Eu
Postado

Ola!

 

Eu queria personalizar o formato do contador regressivo que peguei no NET mas ainda não entendi bem a logica dele para deixar como eu quero

 

Ele está assim:

 

00d00d00h00min

 

Eu queria deixar mais ou menos assim

00 00 00 0

m d h m

 

O cód. disso é:

var faltam = '';
faltam += (dd && dd > 1) ?'<b> '+dd+'D' : (dd==1 ? '1 dia, ' : '');
faltam += (toString(hh).length) ? hh+'H' : '';
faltam += (toString(mm).length) ? mm+'Min' : '<br/>';
faltam += ss+'Seg.';

Eu não sei bem como separar das linhas o D, H...etc :)

 

Eu podia simplesmente criar uma div em baixo para colocar o D H M mas ao zerar o cronometro uma mensagem aparece como: acabou!

 

Sendo assim, se eu colocasse uma div com este texto separado iria aparecer o texto "acabou" e o texto da DIV

 

Obrigado

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

é só vc tirar as letras que estão entre aspas.

Compartilhar este post

Link para o post
Compartilhar em outros sites

ExtremsX    58

ExtremsX
Postado

coloque o codigo todo aqui por favor, se não puder é só tirar as Strings:

var faltam = '';
faltam += (dd && dd > 1) ? dd+' ' : (dd==1 ? '1 dia, ' : '');
faltam += (toString(hh).length) ? hh+' ' : '';
faltam += (toString(mm).length) ? mm+' ' : '<br/>';
faltam += ss;

Compartilhar este post

Link para o post
Compartilhar em outros sites

Apenas Eu    13

Apenas Eu
Postado

Então mas é que eu tava pensando em colocar o dia, etc... em baixo da contagem.

 

o java inteiro:

var YY = 2015;
var MM = 11;
var DD = 6;
var HH = 11;
var MI = 24;
var SS = 00;

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+'<b>D </b>' : (dd==1 ? '1 dia, ' : '');
faltam += (toString(hh).length) ? hh+'<b>H </b> ' : '';
faltam += (toString(mm).length) ? mm+'<b>M </b>' : '';
faltam += ss+'<b>S </b>';

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

<html>
<body onload="atualizaContador()" style="background-color:#CC6600;">

<form name="form1" method="post" action="Default.php" id="form1">
<div>
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUJODExMDE5NzY5ZGQTUswGAu5FrWmWT3ATTAh97uaIjw==" />
</div>


<div id="Principal" style="background-image:url('Images/Fundo.gif'); width: 800px; height: 600px; margin-top:0px; margin:0px auto;">

<div id="Mensagem" style="font-family:Arial; font-size:30px; text-align:center; color:White; padding-top:40px;">
<span id="Label_Mensagem">Qualidade em tempo real!</span> </div>
<div id="relogio" style="font-family: @Arial Unicode MS; font-size:29px; text-align:center; color:#804000; padding-top:400px;"><span id="contador"></span></div>
</div>

</form>
</body>
<html>

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Ai isso ai vai ficar fora do script.

Direto no html:

 

<span id="contador"></span>
<p>DD MM AAA....</p>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Apenas Eu    13

Apenas Eu
Postado

Eu vou tentar....

 

 

Então, deu até certo, mas quando o cronometro zera, continua aparecendo a linha de baixo.

 

Ah mas tudo bem, depois eu vejo isso. Eu queria diferenciar um pouco do site que estou me inspirando, mas acho que esse detalhe é o de menos. Dos dois jeitos fica legal :)

 

De qualquer forma muito obrigado a todos :)

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito