<script>
var tick = 1000;
var second = tick;
var minute = 60 * second;
var hour = 60 * minute;
var halfDay = 12 * hour;
var sHand = {
targets: '.secondHand',
rotate: 360,
easing: 'steps(360)',
duration: minute,
loop: true,
};
var mHand = {
targets: '.minuteHand',
rotate: 360,
easing: 'linear',
duration: hour,
loop: true,
};
var hHand = {
targets: '.hourHand',
rotate: 360,
easing: 'linear',
duration: halfDay,
loop: true,
};
var btn =
document.querySelector('.butt
on');
btn.style.cursor = "pointer";
btn.addEventListener('click',function() {
setTime();
});
var current;
var angleSecond;
var angleMinute;
var angleHour;
function setTime() {
current = new Date();
angleSecond = current.getSeconds() * 6;
angleMinute = current.getMinutes() * 6;
angleHour = current.getHours() * 30 + angleMinute / 12;
var sh = document.querySelector('.secondHand');
sh.style.transform = 'rotate(0deg)';
var mh = document.querySelector('.minuteHand');
mh.style.transform = 'rotate(' + angleMinute + 'deg)';
var hh = document.querySelector('.hourHand');
hh.style.transform = 'rotate(' + angleHour + 'deg)';
anime(hHand).reset;
anime(mHand).reset;
anime(sHand).reset;
}
setTime();
</script>
Press the button if the time drifts - resets to current hh:mm:00