A digital clock
What is a webpage without a clock?
Here I show you how to have a clock showing.
You can style it the way you wan't to of course.
08:35:39
HTML
I have put in the short PHP snip here, so the clock will show the time right when loaded. Else it would not show till it updated (after 1 second).
<span id="span" CLASS='clockstyle' />
<?php echo date('H:i:s');?>
</span>
CSS
<style>
.clockstyle {
background:green;
color:yellow;
border:1px solid;
text-align:center;
line-height:24px;
width:120px;
font-size:16px;
font-family:monospace;
padding:8px;
font-weight:bold;
}
</style>
Javascript
<script type="text/javascript">
var span = document.getElementById('span');
function time() {
var d = new Date();
var s = d.getSeconds();
var m = d.getMinutes();
var h = d.getHours();
span.textContent =
("0" + h).substr(-2) + ":" + ("0" + m).substr(-2) + ":" + ("0" + s).substr(-2);
}
setInterval(time, 1000);
</script>