Clock

Hello People
Have a bit of experimenting and it worked.
A clock that is mounted vertically fixed on the left or right.
If anyone is interested, try it. Runs great in Firefox.


Open header.tpl, search {include file="header_global.tpl"} and then paste the code

PHP:

{literal}

<style type="text/css">
<!--

#VertikaleUhr {
position:fixed;
top:100px;
right:0px;
background-image: url(./digits/backround.gif);
padding:2px:
}

#VertikaleUhr td {
padding:2px:
}

-->
</style>

<script type="text/javascript" language="JavaScript">
<!--

// hier drei Angaben eintragen

Verzeichnis01 = "digits/";
Name01 = "";                        // ohne letzte Nummer
Dateiendung01 = ".gif";

DigitsArr = new Array()
for(i=0; i < 11; i++){
DigitsArr[i] =  Verzeichnis01 + Name01 + i + Dateiendung01;
}

function imageclock(){
Jetzt=new Date();
Sek = Jetzt.getSeconds();
Min = Jetzt.getMinutes();
Std = Jetzt.getHours();

// zweistellige Werte ermitteln
var Zeitstring = ((Std < 10)?"0"+Std:Std)+''+((Min < 10)?"0"+Min:Min)+''+((Sek < 10)?"0"+Sek:Sek);

for (i=0; i < Zeitstring.length; i++){
document.getElementById('z'+i).src = DigitsArr[Zeitstring.charAt(i)];
}

setTimeout('imageclock()',1000);
}

window.onload=imageclock;


function VertikaleUhr() {
document.write('<table id="VertikaleUhr"><tr><td><img id="z5" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img id="z4" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img src="digits/p.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img id="z3" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img id="z2" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img src="digits/p.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img id="z1" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr><tr><td><img id="z0" src="digits/0.gif" width="15" height="11" border="0" alt=""></td></tr></table>');
return
}

//-->
</script>

<script type="text/javascript" language="JavaScript">
<!--
VertikaleUhr();
//-->
</script>

{/literal}

Download images
http://www.prowork-pc24.com/digits.rar

Here you can adjust right or left, image and height.

PHP:

#VertikaleUhr {
position:fixed;
top:100px;
right:0px;
background-image: url(./digits/backround.gif);
padding:2px:
}