PDA

View Full Version : javascript clock


chriskq
03-06-2006, 05:21 AM
http://sivamdesign.com/scripts/clocks.html

Hi all im trying to find a nice looking digital clock for a webpage. I like number 2 on this page, but dont like the colours it uses. Not sure how to change them, does anyone know pls ?

Creative Insanity
03-06-2006, 06:26 AM
That is a simple input from a form chris so if you select the colours in the input walla.
The one in that size is like:
<input type="text" size="11" name="field" style="text-align: center; background: #000000; color: #00ff00; border: 1" />

ranjan
03-06-2006, 06:28 AM
Here is a better modified version
Just change background, color and font to customize

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Javascript Clock</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript">
function doTime() {
var now = new Date();
var hr = now.getHours();
var min = now.getMinutes();
var sec = now.getSeconds();
var suf

(min <= 9) ? min = '0'+min : min;
(sec <= 9) ? sec = '0'+sec : sec;
(hr < 12) ? suf = 'am' : suf = 'pm';
(hr > 12) ? hr = hr - 12 : hr;
(hr <= 9) ? hr = '0'+hr : hr;
document.getElementById('timeHolder').innerHTML = hr + ':' + min + ':' + sec + ' ' + suf;
setTimeout('doTime()',1000);
}
window.onload = doTime;
</script>
<style type="text/css">
#timeHolder {
width:80px;
text-align:center;
padding:5px;
background: #CCCCCC;
color: #333333;
font: bold 10px san-serif;
}
</style>
<body>
<div id="timeHolder"></div>
</body>
</html>

chriskq
03-09-2006, 01:05 AM
heaps better. Cheers