Style 2a
Style 2a
<head>
<style type="text/css">
#count {
border: none;
text-align: center;
font-family: Arial;
font-size: 26px;
font-weight: normal; /* options are normal, bold, bolder, lighter */
font-style: italic; /* options are normal or italic */
color: #66FFCC; /* change color using the hexadecimal color codes for HTML */
background-color: transparent; /* change the background color using the hex color codes for HTML */
}
</style>
</head>
<body>
<div style="text-align: center;">
<div style="margin-left: auto; margin-right: auto; text-align: center; position: relative; ">
<div id="count"></div>
</div>
</div>
<script>
/*
Count down until any date script-
By JavaScript Kit (www.javascriptkit.com)
Over 200+ free scripts here!
Modified by Robert M. Kuhnhenn, D.O. on 5/30/2006
to count down to a specific date AND time
*/
/* Change the items within the quotes below to create your countdown target date and announcement once the target date and time are reached. */
var current="Summer is here!" /* enter what you want the script to display when the target date and time are reached, limit to 20 characters */
var yr="2010" /* enter the count down target date YEAR */
var month="6" /* enter the count down target date MONTH */
var day="21" /* enter the count down target date DAY */
var hr="16" /* enter the count down target date HOUR (24 hour clock) */
var min="28" /* enter the count down target date MINUTE */
// DO NOT CHANGE THE CODE BELOW
var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec")
function countdown(yr,m,d,hr,min){
theyear=yr;themonth=m;theday=d;thehour=hr;theminute=min
var today=new Date()
var todayy=today.getYear()
if (todayy < 1000) {
todayy+=1900 }
var todaym=today.getMonth()
var todayd=today.getDate()
var todayh=today.getHours()
var todaymin=today.getMinutes()
var todaysec=today.getSeconds()
var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec
futurestring=montharray[m-1]+" "+d+", "+yr+" "+hr+":"+min
var dd=Date.parse(futurestring)-Date.parse(todaystring)
var dday=Math.floor(dd/(60*60*1000*24)*1)
var dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1)
var dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1)
var dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1)
if(dday<=0&&dhour<=0&&dmin<=0&&dsec<=0){
document.getElementById('count').innerHTML=current;
return;
}
else {
document.getElementById('count').innerHTML=+dday+ " days, "+dhour+" hours, "+dmin+" minutes, and "+dsec+" seconds";
setTimeout("countdown(theyear,themonth,theday,thehour,theminute)",1000);
}
}
countdown(yr,month,day,hr,min)
</script>
</body>
Countdown to the start of Summer in the Northern Hemisphere: June 21, 2010; 4:28 PM EDST
Select the code by clicking on the "Select entire code" button, then copy it and insert it in an HTML Snippet to get the countdown timer shown above. The code is repeated below with color coding to show what you can change.
You can change some of the formating by changing the items marked below in yellow. You must also change the items in light blue to reflect what you want the script to display when the target date and time are reached and to set the target date and time. Comments are noted in magenta.