sifat009/countdown.html

## countdown.html
<!DOCTYPE html>
<html lang="en">

  <head>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

    <title>RISE-Multipurpose Html Template</title>

    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="author" content="">

    <!-- Bootstrap Css -->
    <link href="./css/bootstrap.min.css" rel="stylesheet">

<style>
	#holder{
  display:inline-block;
}
#holder>div{
  padding:10px;
  border-radius:3px;
  display:inline-block;
}
#holder>div>span{
  padding:15px;
  display:inline-block;
  border-radius:3px;
  background-color:SkyBlue;
  font-size:30px;
  font-weight:bold;
}
#holder>div>div{
  padding-top:5px;
  font-size:16px;
}
</style>
    <!-- Style -->
    <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->

  </head>

  <body>
    <!-- Preloader
	============================================= -->
	<!-- Header
	============================================= -->

	<div id="holder">
	  <div>
	    <span id="d"></span>
		<div>Days</div>
	  </div>
	  <div>
		<span id="h"></span>
		<div>Hours</div>
	  </div>
	  <div>
		<span id="m"></span>
		<div>minutes</div>
	  </div>
	  <div>
		<span id="s"></span>
		<div>Seconds</div>
	  </div>
	</div>
	<h1 class="title">To go!</h1>
<script>
	  function getRemaining(deadline)
{
	var re_time=Math.abs(Date.parse(deadline) - Date.parse(new Date()));
	var sec=Math.floor((re_time/1000)%60);
	sec = sec.toString();
	var minutes=Math.floor((re_time/1000/60)%60);
	minutes = minutes.toString();
	var hours=Math.floor((re_time/(1000*60*60))%24);
	hours = hours.toString();
	var days=(Math.floor(re_time/(1000*60*60*24)));
	days = days.toString();

	return{
		'remaining':re_time,
		'seconds':sec,
		'minutes':minutes,
		'hours':hours,
		'days':days
	};
}
function initC(dl){
	var d=document.getElementById('d'),
	h=document.getElementById('h'),
	m=document.getElementById('m'),
	s=document.getElementById('s');
	var c_down=setInterval(function(){

		var t =getRemaining(dl);
		d.innerHTML = t.days.length    >= 2 ?t.days    :'0'+t.days;
		h.innerHTML = t.hours.length   >= 2 ?t.hours   :'0'+t.hours;
	    m.innerHTML = t.minutes.length >= 2 ?t.minutes :'0'+t.minutes;
		s.innerHTML = t.seconds.length >= 2 ?t.seconds :'0'+t.seconds;
	if(t.remaining <= 0){
		clearInterval(c_down);
	}
	},1000);
}
initC('2016-11-1');
</script>
  </body>


</html>
	<!DOCTYPE html>
	<html lang="en">

	<head>

	<meta http-equiv="content-type" content="text/html; charset=UTF-8">

	<title>RISE-Multipurpose Html Template</title>

	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="description" content="">
	<meta name="keywords" content="">
	<meta name="author" content="">

	<!-- Bootstrap Css -->
	<link href="./css/bootstrap.min.css" rel="stylesheet">

	<style>
	#holder{
	display:inline-block;
	}
	#holder>div{
	padding:10px;
	border-radius:3px;
	display:inline-block;
	}
	#holder>div>span{
	padding:15px;
	display:inline-block;
	border-radius:3px;
	background-color:SkyBlue;
	font-size:30px;
	font-weight:bold;
	}
	#holder>div>div{
	padding-top:5px;
	font-size:16px;
	}
	</style>
	<!-- Style -->
	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

	</head>

	<body>
	<!-- Preloader
	============================================= -->
	<!-- Header
	============================================= -->

	<div id="holder">
	<div>
	<span id="d"></span>
	<div>Days</div>
	</div>
	<div>
	<span id="h"></span>
	<div>Hours</div>
	</div>
	<div>
	<span id="m"></span>
	<div>minutes</div>
	</div>
	<div>
	<span id="s"></span>
	<div>Seconds</div>
	</div>
	</div>
	<h1 class="title">To go!</h1>
	<script>
	function getRemaining(deadline)
	{
	var re_time=Math.abs(Date.parse(deadline) - Date.parse(new Date()));
	var sec=Math.floor((re_time/1000)%60);
	sec = sec.toString();
	var minutes=Math.floor((re_time/1000/60)%60);
	minutes = minutes.toString();
	var hours=Math.floor((re_time/(10006060))%24);
	hours = hours.toString();
	var days=(Math.floor(re_time/(10006060*24)));
	days = days.toString();

	return{
	'remaining':re_time,
	'seconds':sec,
	'minutes':minutes,
	'hours':hours,
	'days':days
	};
	}
	function initC(dl){
	var d=document.getElementById('d'),
	h=document.getElementById('h'),
	m=document.getElementById('m'),
	s=document.getElementById('s');
	var c_down=setInterval(function(){

	var t =getRemaining(dl);
	d.innerHTML = t.days.length >= 2 ?t.days :'0'+t.days;
	h.innerHTML = t.hours.length >= 2 ?t.hours :'0'+t.hours;
	m.innerHTML = t.minutes.length >= 2 ?t.minutes :'0'+t.minutes;
	s.innerHTML = t.seconds.length >= 2 ?t.seconds :'0'+t.seconds;
	if(t.remaining <= 0){
	clearInterval(c_down);
	}
	},1000);
	}
	initC('2016-11-1');
	</script>
	</body>


	</html>