HTML
<!DOCTYPE html>
<html>
<head>
<meta name="author" content="Roland Starke">
<script>
function drawclockwisearc(objCanvas,date){
//canvaswerte bestimmen
var ctx = objCanvas.getContext("2d");
var height = objCanvas.height;
var width = objCanvas.width;
var r = Math.min(height,width)/2; //radius
//canvaswerte bestimmen
//zeit einlesen
var sec = date.getSeconds() + date.getMilliseconds()/1000;
var min = date.getMinutes() + date.getSeconds()/60;
var stu = date.getHours()%12 + date.getMinutes()/60;
//zeit einlesen
//aussehen des zeigers
//beschreibung: style = farbe des zeigers, size = länge des zeigers im verhältniss zum radius,mid = an welcher stelle ist der zeiger festgeschraubt ,width = dicke des zeigers
var hzeiger = {'style':'#000', 'size':0.5, 'mid':0.1, 'width':6};//stundenzeiger
var mzeiger = {'style':'#000', 'size':0.8, 'mid':0.1, 'width':3};//minutenzeiger
var szeiger = {'style':'#a00', 'size':0.9, 'mid':0.2, 'width':2};//secundenzeiger
//aussehen des zeigers
//aussehen des schattens
ctx.shadowBlur = 2;
ctx.shadowOffsetX = 2;
ctx.shadowOffsetY = 2;
ctx.shadowColor = "#000";
ctx.lineWidth = 5;
//aussehen des schattens
ctx.save();
ctx.clearRect(0, 0, width, height);
ctx.translate(width/2 , height/2);
//stundenzeiger
ctx.save();
ctx.rotate(stu/12 * Math.PI*2);
ctx.beginPath();
ctx.moveTo(0, +(hzeiger['size']*(hzeiger['mid'])*r));
ctx.lineTo(0, -(hzeiger['size']*(1-hzeiger['mid'])*r));
ctx.lineWidth = hzeiger['width'];
ctx.strokeStyle = hzeiger['style'];
ctx.stroke();
ctx.restore();
//Minutenzeiger
ctx.save();
ctx.rotate(min/60 * Math.PI*2);
ctx.beginPath();
ctx.moveTo(0, +(mzeiger['size']*(mzeiger['mid'])*r));
ctx.lineTo(0, -(mzeiger['size']*(1-mzeiger['mid'])*r));
ctx.lineWidth = mzeiger['width'];
ctx.strokeStyle = mzeiger['style'];
ctx.stroke();
ctx.restore();
//Sekundenzeiger
ctx.save();
ctx.rotate(sec/60 * Math.PI*2);
ctx.beginPath();
ctx.moveTo(0, +(szeiger['size']*(szeiger['mid'])*r));
ctx.lineTo(0, -(szeiger['size']*(1-szeiger['mid'])*r));
ctx.lineWidth = szeiger['width'];
ctx.strokeStyle = szeiger['style'];
ctx.stroke();
ctx.restore();
ctx.restore();
}
</script>
</head>
<body>
<canvas width="150" height="150" id="uhr"></canvas>
<script>setInterval("drawclockwisearc(document.getElementById('uhr'),(new Date()));",1000);</script>
</body>
</html>damit es sich auch lohnt javascript an zuschalten ( unkown-6363 ^^) hier eine canvas uhr mit zeigern
http://test.ds-pro.de/CSS3undHTML5/newstuff/clook.html