digital clock in jquery


/ Published in: jQuery
Save to your folder(s)



Copy this code and paste it in your HTML
  1. function updateClock ( )
  2. {
  3. var currentTime = new Date ( );
  4. var currentHours = currentTime.getHours ( );
  5. var currentMinutes = currentTime.getMinutes ( );
  6. var currentSeconds = currentTime.getSeconds ( );
  7.  
  8. // Pad the minutes and seconds with leading zeros, if required
  9. currentMinutes = ( currentMinutes < 10 ? "0" : "" ) + currentMinutes;
  10. currentSeconds = ( currentSeconds < 10 ? "0" : "" ) + currentSeconds;
  11.  
  12. // Choose either "AM" or "PM" as appropriate
  13. var timeOfDay = ( currentHours < 12 ) ? "AM" : "PM";
  14.  
  15. // Convert the hours component to 12-hour format if needed
  16. currentHours = ( currentHours > 12 ) ? currentHours - 12 : currentHours;
  17.  
  18. // Convert an hours component of "0" to "12"
  19. currentHours = ( currentHours == 0 ) ? 12 : currentHours;
  20.  
  21. // Compose the string for display
  22. var currentTimeString = currentHours + ":" + currentMinutes + ":" + currentSeconds + " " + timeOfDay;
  23.  
  24.  
  25. $("#clock").html(currentTimeString);
  26.  
  27. }
  28.  
  29. $(document).ready(function()
  30. {
  31. setInterval('updateClock()', 1000);
  32. });

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.