JSFiddle - React, Tailwind, and code Playground
by mvasko
HTML
<input type="text" class="hours" />:
<input type="text" class="minutes" />:
<input type="text" class="seconds" />
<div id=clock">
<canvas id="myCanvas" width="500" height="500" style="border:1px solid #blue;">
Your browser does not support the HTML5 canvas tag.</canvas>
CSS
input {
width: 20px;
}
#myCanvas {
background:url(http://www.deificink.com/app/download/7113660246/face.png);
}
JavaScript
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
setInterval(function () {
setInterval(function () {
var o = new Date();
var n = o.toString().split(' ');
var p = n[4].split(':');
whi (p[0] === "14") { alert(); }
}, 1000);
}, 1000);
if(.hours==13){
ctx.moveTo(480,250);
ctx.lineTo(250,250);
ctx.stroke();
}else if(.hours==14){
ctx.moveTo(440,360);
ctx.lineTo(250,250);
ctx.stroke();
}