Set / Display current time using JavaScript, Most of the websites are displaying time in their website, for that, here we are going to see how to set simple JavaScript digital timer in our website. It is one of the simple one. let see the coding.

usually we know the coding to find the date in JavaScript. when we are using Date() in javascript that shows the date in webpage. from that we have split that code to show the time alone. let see the detailed script code to time widget.
CODE
<div class="timewidget">
<script type="text/javascript">
function ctime(){
if (!document.getElementById)
return
timeElement=document.getElementById("timeid")
var curdate=new Date()
var hours=curdate.getHours()
var minutes=curdate.getMinutes()
var seconds=curdate.getSeconds()
var DayNight="PM"
if (hours<12) DayNight="AM";
if (hours>12) hours=hours-12;
if (hours==0) hours=12;
if (minutes<=9) minutes="0"+minutes;
if (seconds<=9) seconds="0"+seconds;
var ctime=hours+":"+minutes+":"+seconds+" "+DayNight;
timeElement.innerHTML="<p class='time'>"+ctime+"</p>"
setTimeout("ctime()",1000)
}
window.onload=ctime
</script>
<p class="headtime"> Current time is </p>
<span id=timeid></span>
</div>
CSS
<style media="all" type="text/css"> * { margin:0 auto; padding:0px; width:100%; background-color:#53C66C; } .timewidget { margin-top:10%; min-width:25%; } .time { font-family:Tahoma, Geneva, sans-serif; text-align:center; font-size:30px; color:#750075; font-weight:bold; } .headtime { font-size:16px; text-align:center; text-transform:uppercase; color:#036; font-weight:bold; } </style>
No comments:
Post a Comment