JSFiddle - React, Tailwind, and code Playground

by der_robert

HTML

<span id="timedownproduct-123"></span>

JavaScript

function timedownproduct(ti,id,pid){
	// Set the date we're counting down to
	var countDownDate = new Date(ti).getTime();

	// Update the count down every 1 second
	var x = setInterval(function() {

		// Get todays date and time
		var now = new Date().getTime();

		// Find the distance between now an the count down date
		var distance = countDownDate - now;

		// Time calculations for days, hours, minutes and seconds
		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);

		// Output the result in an element with id="demo"
		document.getElementById("timedownproduct-"+pid).innerHTML = (days!=0 ? days + "d " : '') + (hours!= 0 ? hours + "h " : '')
		+ (minutes != 0 ? minutes + "m " : '') + seconds + "s ";

		// If the count down is over, write some text 
		if (distance < 0) {
			clearInterval(x);
			document.getElementById("timedownproduct-"+pid).innerHTML = "00d 00h 00m 00s";
		}
	}, 1000);
}

timedownproduct('2020-12-01 10:00:00','timedownproduct',123);