This example show how to insert clock on the website which is not static clock, but like a digital clock.
By Mohd Zulkamal
NOTE : – If You have Found this post Helpful, I will appreciate if you can Share it on Facebook, Twitter and Other Social Media Sites. Thanks =)
Read More...
Script for Creating Clock
<script type="text/javascript"> function updateClock() { var currentTime = new Date(); var currentHours = currentTime.getHours(); var currentMinutes = currentTime.getMinutes(); var currentSeconds = currentTime.getSeconds(); // Pad the minutes and seconds with leading zeros, if required currentMinutes = (currentMinutes < 10 ? "0" : "") + currentMinutes; currentSeconds = (currentSeconds < 10 ? "0" : "") + currentSeconds; // Choose either "AM" or "PM" as appropriate var timeOfDay = (currentHours < 12) ? "AM" : "PM"; // Convert the hours component to 12-hour format if needed currentHours = (currentHours > 12) ? currentHours - 12 : currentHours; // Convert an hours component of "0" to "12" currentHours = (currentHours == 0) ? 12 : currentHours; // Compose the string for display var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay; // Update the time display document.getElementById("clock").firstChild.nodeValue = currentTimeString; //return currentTimeString; } </script>
Call the clock on body load
<body onload="updateClock(); setInterval('updateClock()', 1000 );">
Div element for clock
<div id="clock" style="font-size:larger; font-family:Verdana;"> </div>
Output
By Mohd Zulkamal
NOTE : – If You have Found this post Helpful, I will appreciate if you can Share it on Facebook, Twitter and Other Social Media Sites. Thanks =)