Classic Clock With code

Image

Real time example

Sorry Friends this Preview code not work for blog

Inspect the HTML

<!DOCTYPE html>
<html lang="en-US"> 
<head> 
<title>Clock</title> 
<meta charset=utf-8 /> 
<style>
#container{
height: 100%;
width: 100%; 
}
#clock {stroke-linecap: round;}
#surface{stroke-width: 5px;} 
#hour {stroke-width: 5px;}
#second {stroke-width: 1px;}
#minute{stroke-width: 3px;} 
#numbers {font-family: sans-serif; font-size: 80%;} 
</style>
<script>
function timerTick() {
with (new Date()) {
var h, m, s; h = 30 * ((getHours() % 12) + getMinutes() / 60);
m = 6 * getMinutes();
s = 6 * getSeconds();
document.getElementById('hour').setAttribute('transform', 'rotate(' + h + ', 50, 50)'); 
document.getElementById('minute').setAttribute('transform', 'rotate(' + m + ', 50, 50)');
document.getElementById('second').setAttribute('transform', 'rotate(' + s + ', 50, 50)');
setTimeout(timerTick, 1000); 
}
}
</script> 
    
</head>
<body onload='timerTick()'> 
<table id='container'>
<tr><td align="center">
<svg id='clock' viewBox='0 0 100 100' width='350' height='350'> 
<circle id='surface' cx='50' cy='50' r='47.5' fill="blue" stroke="#000"/>

</svg>
</td></tr>
</table>
</body> 
</html>

Download this HTML Source Code

Google drive download

Direct Download Zip files

Thank you so much for contacting me friends 😀 😀

In your great support I have fix many bugs of my blog and update some posts.😇 😇

Also Read

Facebook Login Page

Disco Light animation

Image Slideshow version-2

12 Modal Checkboxes

Pre-Loader version-3

Kumar Lakshmanan

Make Classic Clock

Image

Real time example

Sorry Friends this Preview code not work for blog

Inspect the HTML

Download this HTML Source Code

Google drive download

Direct Download Zip files

Thank you so much for contacting me friends 😀 😀

In your great support I have fix many bugs of my blog and update some posts.😇 😇

Also Read

Post a Comment

0 Comments

Labels

Join Our Whatsapp Group

Search This Blog

Popular Posts

Seven Spinner Animations Using Font-icons

Disco Lights Animation using CSS

Total Pageviews

Contact Form

Footer Menu Widget

Kumar Lakshmanan

Make Classic Clock

Image

Real time example

Sorry Friends this Preview code not work for blog

Inspect the HTML

Download this HTML Source Code

Google drive download

Direct Download Zip files

Thank you so much for contacting me friends 😀 😀 In your great support I have fix many bugs of my blog and update some posts.😇 😇

Also Read

You may like these posts

Post a Comment

0 Comments

Labels

Join Our Whatsapp Group

Search This Blog

Popular Posts

Seven Spinner Animations Using Font-icons

Disco Lights Animation using CSS

Total Pageviews

Contact Form

Footer Menu Widget

Thank you so much for contacting me friends 😀 😀

In your great support I have fix many bugs of my blog and update some posts.😇 😇