Menu
Hey guys,
I created a count down timer, but when i put it into a <td> </td>it stretches the table. Any suggestions? Below is the countdown timer coding.
I’ve also added a .jpg of what it looks like
CSS
[CODE]
.rheader {
line-height:100%;
text-align: center;
font-family: Arial;
font-size: 16px;
font-weight: bold;
font-style: normal;
color: #ff0000;
}
.rtitle {
width: 55px;
text-align: center;
font-family: Arial;
font-size: 10px;
font-weight: bold;
color: #ff0000;
}
.rtable {
border-style: none;
background-color: transparent;
margin: 0px auto;
position: relative;
top: 0px;
left: -49px;
}
.rnumbers {
width: 55px;
text-align: center;
font-family: Arial;
font-size: 28px;
font-weight: bold;
font-style: normal;
color: #ffffff;
}
.rtitle {
width: 55px;
text-align: center;
font-family: Arial;
font-size: 10px;
font-weight: bold;
color: #ffffff;
}
script before the </head>
[CODE]
<script type=”text/javascript”>
var current=”EXPIRED!”
var year=2010
var month=11
var day=22
var hour=16
var minute=0
var tz=-5
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 todaystring1=montharray[todaym]+” “+todayd+”, “+todayy+” “+todayh+”:”+todaymin+”:”+todaysec
var todaystring=Date.parse(todaystring1)+(tz*1000*60*60)
var futurestring1=(montharray[m-1]+” “+d+”, “+yr+” “+hr+”:”+min);
var futurestring=Date.parse(futurestring1)-(today.getTimezoneOffset()*(1000*60));
var dd=futurestring-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(‘count2’).innerHTML=current;
document.getElementById(‘count2’).style.display=”inline”;
document.getElementById(‘count2’).style.width=”390px”;
document.getElementById(‘dday’).style.display=”none”;
document.getElementById(‘dhour’).style.display=”none”;
document.getElementById(‘dmin’).style.display=”none”;
document.getElementById(‘dsec’).style.display=”none”;
document.getElementById(‘days’).style.display=”none”;
document.getElementById(‘hours’).style.display=”none”;
document.getElementById(‘minutes’).style.display=”none”;
document.getElementById(‘seconds’).style.display=”none”;
document.getElementById(‘spacer1’).style.display=”none”;
document.getElementById(‘spacer2’).style.display=”none”;
return;
}
else {
document.getElementById(‘count2’).style.display=”none”;
document.getElementById(‘dday’).innerHTML=dday;
document.getElementById(‘dhour’).innerHTML=dhour;
document.getElementById(‘dmin’).innerHTML=dmin;
document.getElementById(‘dsec’).innerHTML=dsec;
setTimeout(“countdown(theyear,themonth,theday,thehour,theminute)”,1000);
}
}
</script>
Here’s the table
[CODE]
<tD><table id=”rtable” border=”0″ cellpadding=”0″ cellspacing=”0″>
<tr>
<td align=”left” colspan=”6″><div class=”rnumbers” id=”count2″></div></td>
</tr>
<tr id=”spacer2″ height=”12″>
<td align=”center” ><div class=”rtitle” ></div></td>
<td align=”center” ><div class=”rtitle” id=”days”>Days</div></td>
<td align=”center” ><div class=”rtitle” id=”hours”>Hours</div></td>
<td align=”center” ><div class=”rtitle” id=”minutes”>Minutes</div></td>
<td align=”center” ><div class=”rtitle” id=”seconds”>Seconds</div></td>
<td align=”center” ><div class=”rtitle” ></div></td>
</tr>
<tr id=”spacer1″ height=”30″>
<td align=”center” ><div class=”rnumbers” ></div></td>
<td align=”center” ><div class=”rnumbers” id=”dday”></div></td>
<td align=”center” ><div class=”rnumbers” id=”dhour”></div></td>
<td align=”center” ><div class=”rnumbers” id=”dmin”></div></td>
<td align=”center” ><div class=”rnumbers” id=”dsec”></div></td>
<td align=”center” ><div class=”rnumbers” ></div></td>
</tr>
</table></td>
[upl-file uuid=6472fd90-52ae-4dba-b068-fa1e7c47cee5 size=74kB]untitled.JPG