show clock in javascript code example
Example: how to make a clock in html/javascript
<!-- This is set automatically to your time zone -->
<script>
function showTime(){
var date = new Date();
var d = date.getDate();
var d1 = date.getDay();
var h = date.getHours();
var m = date.getMinutes();
var s = date.getSeconds();
var session = "PM";
if(h == 02){
h = 12;
}
if(h > 12){
session = "PM";
}
if(h < 12) {
session = "AM"
}
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
var time = d + "/"+ d1+ " " + "Time:" + " " + h + ":" + m + ":" + s + " " + session;
document.getElementById("MyClockDisplay").innerText = time;
document.getElementById("MyClockDisplay").textContent = time;
setTimeout(showTime, 1000);
}
showTime();
</script>
<style>
body {
background: url('computerIMGedit.jpg');
color: white;
}
.clock {
position: absolute;
top: 50%;
left: 50%;
transform: translateX(-50%) translateY(-50%);
color: #e6967e;
font-size: 60px;
font-family: 'Josefin Sans', sans-serif;
letter-spacing: 7px;
-webkit-transition: 0.5s;
}
.clock:hover {
transform: translateY(-10px);
transition: 0.5s;
font-size: 80px;
color: whitesmoke;
}
</style>
<div id="MyClockDisplay" class="clock" onload="showTime()">
</div>