Contare giorni in ore e millisecondi

[giganext]

Buona sera a tutti. Ho trovato e modificato questo script in rete

<p id="demo"></p>

<script>
// SETTO IL TEMPO
var countDownDate = new Date("Dec 25, 2018 00:00:00").getTime();

// AGGIORNO OGNI SECONDO IL TEMPO
var x = setInterval(function() {

  // PRENDO LA DATA REALE
  var now = new Date().getTime();

  // CERCO LA "DISTANZA" TRA LA DATA E IL TEMPO
  var distance = countDownDate - now;

  // CALCOLO IL TEMPO
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // STAMPO IL RISULTATO
  document.getElementById("demo").innerHTML = days + "&nbsp;GIORNI " + hours + "&nbsp;ORE "
  + minutes + "&nbsp;MINUTI " + seconds + "&nbsp;SECONDI ";

  // TEMPO SCADUTO
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "ALTRE OFFERTE A BREVE!";
  }
}, 1000);
</script>

Questo codice mi restituisce i giorni, le ore, i minuti e i secondi che mancano a natale. Basta modificare la variabile <b>countDownDate</b> per ottenere il conto alla rovescia che si desidera. Ora, avrei la necessità di stampare soltanto le ORE, MINUTI, SECONDI E MILLISECONDI.

ESEMPIO:

72 ore, 34 minuti, 21 secondi e 1000 millesimi a natale

Avete idee a riguardo? Come si fa? Grazie in anticipo.

[alemoppo]

Tieni presente che distance contiene il numero in millisecondi tra le due date.
Quindi dovrai convertirle in ore, minuti, secondi e ms. L'unica accortezza è che

}, 1000);

Dovrai diminuire il tempo di attesa tra un richiamo e il successivo così da apprezzare anche lo scorrimento dei millisecondi.
Idealmente andrebbe impostato a 1, così da aggiornarsi ogni millisecondo. Non credo però che tu riesca a distinguere i millisecondi, quindi potresti benissimo impostare anche 10 o 100.

Ciao!

[giganext]

Mi hai fatto ragionare parecchio, così mi sono detto: ma se creo una variabile con 2 cifre di numeri, li setto a 99 e li decremento con setInterval()? Cosi facendo, è uscito fuori questo che funziona alla perfezione:

<table>
<td><p id="demo"></p></td><td><p id="mille"></p></td>
</table>

<script>
// SETTO IL TEMPO
var countDownDate = new Date("Dec 25, 2018 00:00:00").getTime();

// AGGIORNO OGNI SECONDO IL TEMPO
var x = setInterval(function() {

  // PRENDO LA DATA REALE
  var now = new Date().getTime();

  // CERCO LA "DISTANZA" TRA LA DATA E IL TEMPO
  var distance = countDownDate - now;
var decimi= Math.round(100);
  

  // CALCOLO IL TEMPO
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);
  

  setInterval(function() { decimi--; if(decimi == 0){ decimi = 100; }

document.getElementById("mille").innerHTML = decimi +"";


}, 10);



  // STAMPO IL RISULTATO
  document.getElementById("demo").innerHTML = days + ":" + hours + ":"
  + minutes + ":" + seconds + ":";


  // TEMPO SCADUTO
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "ALTRE OFFERTE A BREVE!";
  }
},1000);
</script>

L'ultimo problema però è questo: come faccio settare le ore a 72 (esempio) e non decrementare i giorni?

[alemoppo]

Pensavo di averti risposto, evidentemente non mi ha inviato il messaggio.

Per farla breve:

// SETTO IL TEMPOf

var countDownDate = new Date("Dec 25, 2018 00:00:00").getTime();

// AGGIORNO OGNI SECONDO IL TEMPO
var x = setInterval(function() {

  // PRENDO LA DATA REALE
  var now = new Date().getTime();

  // CERCO LA "DISTANZA" TRA LA DATA E IL TEMPO
  var distance = countDownDate - now;
	ore = Math.floor(distance / (1000*60*60));
	minuti = Math.floor((distance % (1000*60*60))/(1000*60));
	secondi = Math.floor((distance % (1000*60))/1000);
	millisecondi = Math.floor(distance % 1000);
	
  // STAMPO IL RISULTATO
  document.getElementById("demo").innerHTML = ore + " ORE "
  + minuti + " MINUTI " + secondi + " SECONDI "+millisecondi+ " ms";

  // TEMPO SCADUTO
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "ALTRE OFFERTE A BREVE!";
  }
}, 50);

Ciao!