(:html:) <h1>Countdown Timer</h1>
<style type="text/css"> .timer {
visibility: hidden; text-align: center; background: black; font-family: Arial; font-weight: bold; border: 0px;
}
.timer_pad {
padding: 10px;
}
.digits {
margin-top: 35px; color: chartreuse; font-size: 40pt; font-family: Verdana;
}
.title {
color: white;
}
.hours, .minutes, .seconds {
margin-left: 3px;
}
.hours, .minutes {
margin-right: 5px;
}
.field_cont {
margin-top: 15px;
}
.field {
color: yellow;
}
.btn_cont {
margin-top: 20px;
}
.start, .pause, .resume, .reset {
font-family:arial; margin-right: 5px;
} </style>
<table bgcolor=#000000 id="CH_dtimer1" class="timer"> <tr> <td class="timer_pad"> <div class="title">Time left</div>
<div id="CH_dtimer1_digits" class="digits"></div> <p> </p> <div class="field_cont">
<label class="field">Hours: <input id="CH_dtimer1_hours" class="hours" type="text" size="2" disabled="disabled" /> </label> <label class="field">Minutes: <input id="CH_dtimer1_minutes" class="minutes" type="text" size="2" disabled="disabled" /> </label> <label class="field">Seconds: <input id="CH_dtimer1_seconds" class="seconds" type="text" size="2" disabled="disabled" /> </label>
</div>
<div class="btn_cont">
<input id="CH_dtimer1_start" class="start" type="button" value="Start" disabled="disabled" /> <input id="CH_dtimer1_pause" class="pause" type="button" value="Pause" disabled="disabled" /> <input id="CH_dtimer1_resume" class="resume" type="button" value="Resume" disabled="disabled" /> <input id="CH_dtimer1_reset" class='reset' type="button" value="Reset" disabled="disabled" />
</div> </td> </tr> </table>
<script type="text/javascript" src="http://www3.hku.hk/philodep/joelau/media/coolCount.js"></script>
(:htmlend:)