Digital Uhren - Website X5 Hilfe - Die Helpsite

Direkt zum Seiteninhalt

Hauptmenü:

Digital Uhren

Scripte > Attachment

Digital-Uhren in vielfältiger Auswahl

Ob Javascript oder Flash, ob groß oder klein - eine kleine Auswahl an digitalen Uhren. Diese Uhren sind im handumdrehen auf der Homepage eingebaut. Einfach die ZIP-Datei herunter laden, entpacken und die entsprechende Uhr aussuchen. Für die "Javascript Digit-Uhren" liegen eine Reihe Ordner mit Digits zum aussuchen und anpassen dabei. Dazu muss im Javascript Code die Anpassung der Dateinamen entsprechend vorgenommen werden.
Für die Navigation auf dieser Homepage wird der
Flash-Player von Adobe benötigt.
Bitte darauf achten, dass die aktuelle Flash Player Version installiert und das Plugin auch aktiviert ist.

Adult Flash-Uhr

Javascript Digi-Uhr 1

Javascript-Uhr 3

Javascript-Uhr 1

Javascript Digi-Uhr 2

Javascript-Uhr 4

Javascript-Uhr 2

Javascript Balken-Uhr

00:00:00

Little Flash-Uhren

Stunden:
Minuten:
Sekunden:
Zeit:

Code Adult Flash-Uhr:

Code für das HTML-Objekt:

[Objekt HTML]

<object data="files/digi-uhr.swf" type="application/x-shockwave-flash" width="150" height="50">  
<param name="movie" value="files/digi-uhr.swf" />  
<param name="menu" value="false" />
<param name="quality" value="high" />
<param name="bgcolor" value="#FF0000" />
<param name="wmode" value="#FF0000" />
</object>
<!-- Pfade, Farben und Darstellungsmaße anpassen -->

Code Little Flash-Uhren:

Code für das HTML-Objekt:

[Objekt HTML]

<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"
codebase=
"http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
width=
"50" height="20" id="digital-uhr">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="files/digital-uhr.swf?m_Farbe=ffffff" />
<param name="quality" value="high" />
<param name="bgcolor" value="#0000ff" />
<embed src="files/digital-uhr.swf?m_Farbe=ffffff" quality="high"
bgcolor=
"#0000ff" width="50" height="20" name="digital-uhr"
allowScriptAccess=
"sameDomain" type="application/x-shockwave-flash"
pluginspage=
"http://www.macromedia.com/go/getflashplayer" />
</object>
<!-- Pfade, Farben und Darstellungsmaße anpassen, genaue Schreibweise beachten -->

Code Javascript-Uhr 1 :

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<style type="text/css">
.frm { font-family: Tahoma; font-size: 14px; font-weight: bold; background-color: #B30607;
border: 2px solid
#000; width: 130px; padding: 3px; text-align: center; }
</style>

Code für das HTML-Objekt:

[Objekt HTML]

<form class="frm" name="clockForm">
<input type="text" name="clock" size="8">
</form>
<script language="JavaScript">
function display() {
var Today = new Date();
var hours = Today.getHours();
var min = Today.getMinutes();
var sec = Today.getSeconds();
var Time = ((hours > 12) ? hours - 12 :(hours == 0) ? 12 :hours);
Time += ((min < 10) ? ":0" : ":") + min;
Time += ((sec < 10) ? ":0" : ":") + sec;
Time += (hours >= 24) ? " AM" : " PM";
this.clockForm.clock.value = Time;
setTimeout("display()",1000);
}
display();
</script>

Code Javascript-Uhr 2:

Code für das HTML-Objekt:

[Objekt HTML]

<p  style="color:#000; font-size:14px; font-weight:bold; background-color:yellow; width:150px; text-align:center;" id="theTimer">00:00:00</p>
<script type="text/javascript">
window.setTimeout("updateTime()", 0);  
// Start sofort
window.setInterval("updateTime()", 60);  
// Update alle 60 Sekunden
function updateTime() {
document.getElementById("theTimer").firstChild.nodeValue =
new Date().toTimeString().substring(0, 8);
}
</script>

Code Javascript-Uhr 3:

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<style type="text/css">
#Timer {position: relative; width: 200px; border: 2px solid #000000; text-align: center; padding: 6px; font-family: Tahoma; color: #00E090; font-size:24px; background-color: #5F5F5F; }
</style>

Code für den HEAD-Bereich:

[Vor dem /HEAD]

<script type="text/javascript" language="JavaScript">
<!--  Beginn Javascriptuhr 3
DayName = new Array(
"Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag");
function UhrAnzeigen()
{
var SysDatumJetzt = new Date();
var SysTag = SysDatumJetzt.getDate();
var SysMonat = SysDatumJetzt.getMonth() + 1;
var SysJahr = SysDatumJetzt.getFullYear();
var SysStunden = SysDatumJetzt.getHours();
var SysMinuten = SysDatumJetzt.getMinutes();
var SysSekunden = SysDatumJetzt.getSeconds();
var WochentagNr = SysDatumJetzt.getDay();
var JetztWochentag = DayName[WochentagNr]
var JetztTag  = ((SysTag < 10) ? "0" : "") + SysTag ;
var JetztMonat  = ((SysMonat < 10) ? ".0" : ".") + SysMonat;
var JetztStd  = ((SysStunden < 10) ? "0" : "") + SysStunden;
var JetztMin  = ((SysMinuten < 10) ? ":0" : ":") + SysMinuten;
var JetztSec  = ((SysSekunden < 10) ? ":0" : ":") + SysSekunden;
var JetztDatum = JetztTag + JetztMonat + "." + SysJahr;
var JetztZeit = JetztStd + JetztMin + JetztSec + " Uhr";
var DispString = JetztZeit;
Timer.innerHTML = DispString;
setTimeout("UhrAnzeigen()", 1000);
}
window.setTimeout('UhrAnzeigen()',1000);
//  Ende Javascriptuhr 3 -->
</script>

Code für das HTML-Objekt:

[Objekt HTML]

<div id="Timer"></div>

Code Javascript-Uhr 4:

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<style type="text/css">
.clockStyle { background-color: #000; border: #999 2px inset; font-family: "Arial Black", Gadget, sans-serif; color: #B30607; font-size: 16px; font-weight: bold; letter-spacing: 2px; padding: 6px; display: inline; }
</style>

Code für das HTML-Objekt:

[Objekt HTML]

<div id="clockDisplay" class="clockStyle"></div>
<script type="text/javascript" language="javascript">
function renderTime() {
var currentTime = new Date();
var diem = "AM";
var h = currentTime.getHours();
var m = currentTime.getMinutes();
var s = currentTime.getSeconds();
setTimeout('renderTime()',1000);
if (h == 0) {
h = 12;
} else if (h > 12) {
h = h - 12;
diem="PM";
}
if (h < 10) {
h = "0" + h;
}
if (m < 10) {
m = "0" + m;
}
if (s < 10) {
s = "0" + s;
}
var myClock = document.getElementById('clockDisplay');
myClock.textContent = h + ":" + m + ":" + s + " " + diem;
myClock.innerText = h + ":" + m + ":" + s + " " + diem;
}
renderTime();

</script>

Code Javascript Digi-Uhr 1:

Code innerhalb des BODY-Tag:

[Im Tag BODY]

onLoad="DigiClock();"
ohne Website X5:
<body onLoad="DigiClock();">

Code für den HEAD-Bereich:

[Vor dem /HEAD]

<script language=javascript>
<!-- Beginn Digi-Uhr 1
function DigiClock()
{
thedate = new Date();
hours = thedate.getHours();
minutes = thedate.getMinutes();
gif_base = "images/cl_"
// Pfad anpassen
gif_ext = ".gif"
pic_hz=Math.round((hours+5)/10-1);
pic_he=hours - Math.round((hours+5)/10-1)*10;
pic_mz=Math.round((minutes+5)/10-1);
pic_me=minutes - Math.round((minutes+5)/10-1)*10;
document.images.HZ.src=gif_base + pic_hz + gif_ext;
document.images.HE.src=gif_base + pic_he + gif_ext;
document.images.MZ.src=gif_base + pic_mz + gif_ext;
document.images.ME.src=gif_base + pic_me + gif_ext;
my_string = document.images.DP.src;
if (my_string.indexOf("cl_.gif") > 0)
document.images.DP.src = gif_base + 'dpt' + gif_ext;
else
document.images.DP.src = gif_base + gif_ext;
window.setTimeout("DigiClock();",2000);
}
//  Ende Digi-Uhr 1 -->
</script>

Code für das HTML-Objekt:

[Objekt HTML]

<nobr>
<img src="images/cl_.gif" width="20" height="30" name="HZ">
<img src="images/cl_.gif" width="20" height="30" name="HE">
<img src="images/cl_.gif" width="10" height="30" name="DP">
<img src="images/cl_.gif" width="20" height="30" name="MZ">
<img src="images/cl_.gif" width="20" height="30" name="ME">
</nobr>

Code Javascript Digi-Uhr 2:

Code innerhalb des BODY-Tag:

[Im Tag BODY]

onLoad="getTime();"
ohne Website X5:
<body onLoad="getTime();">

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<script language="JavaScript" type="text/javascript">
<!-- Beginn Digi-Uhr 2
function getTime() {
// Image-Pfade anpassen
c1 = new Image(); c1.src = "images/digi1.gif";
c2 = new Image(); c2.src = "images/digi2.gif";
c3 = new Image(); c3.src = "images/digi3.gif";
c4 = new Image(); c4.src = "images/digi4.gif";
c5 = new Image(); c5.src = "images/digi5.gif";
c6 = new Image(); c6.src = "images/digi6.gif";
c7 = new Image(); c7.src = "images/digi7.gif";
c8 = new Image(); c8.src = "images/digi8.gif";
c9 = new Image(); c9.src = "images/digi9.gif";
c0 = new Image(); c0.src = "images/digi0.gif";
Cc = new Image(); Cc.src = "images/digi_dp.gif";
now = new Date();
later = new Date("Jan 1 " + (parseInt(new Date().getFullYear())+1) + " 00:00:00");
days = (later - now) / 1000 / 60 / 60 / 24;
daysRound = Math.floor(days);
hours = (later - now) / 1000 / 60 / 60 - (24 * daysRound);
hoursRound = Math.floor(hours);
minutes = (later - now) / 1000 /60 - (24 * 60 * daysRound) - (60 * hoursRound);
minutesRound = Math.floor(minutes);
seconds = (later - now) / 1000 - (24 * 60 * 60 * daysRound) - (60 * 60 * hoursRound) - (60 * minutesRound);
secondsRound = Math.round(seconds);
if (secondsRound
<= 9) {
document.images.g.src = c0.src;
document.images.h.src = eval("c"+secondsRound+".src");
}
else {
document.images.g.src = eval("c"+Math.floor(secondsRound/10)+".src");
document.images.h.src = eval("c"+(secondsRound%10)+".src");
}
if (minutesRound <= 9) {
document.images.d.src = c0.src;
document.images.e.src = eval("c"+minutesRound+".src");
}
else {
document.images.d.src = eval("c"+Math.floor(minutesRound/10)+".src");
document.images.e.src = eval("c"+(minutesRound%10)+".src");
}
if (hoursRound <= 9) {
document.images.y.src = c0.src;
document.images.z.src = eval("c"+hoursRound+".src");
}
else {
document.images.y.src = eval("c"+Math.floor(hoursRound/10)+".src");
document.images.z.src = eval("c"+(hoursRound%10)+".src");
}
if (daysRound <= 9) {
document.images.x.src = c0.src;
document.images.a.src = c0.src;
document.images.b.src = eval("c"+daysRound+".src");
}
if (daysRound <= 99) {
document.images.x.src = c0.src;
document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src");
document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src");
}
if (daysRound <= 999){
document.images.x.src = eval("c"+Math.floor(daysRound/100)+".src");
document.images.a.src = eval("c"+Math.floor((daysRound/10)%10)+".src");
document.images.b.src = eval("c"+Math.floor(daysRound%10)+".src");
}
newtime = window.setTimeout("getTime();", 1000);
}
//  Ende Digi-Uhr 2 -->
</script>

Code für das HTML-Objekt:

[Objekt HTML]

<script language="JavaScript">
var ziffern;
var timerID;
// Image-Pfade anpassen, auch bei ziffern [i]
function uhrEinfuegen() {
document.write('<img name="stundenZehner" src="images/digi0.gif">');
document.write('<img name="stundenEiner" src="images/digi0.gif">');
document.write('<img src="images/digi_dp.gif">');
document.write('<img name="minutenZehner" src="images/digi0.gif">');
document.write('<img name="minutenEiner" src="images/digi0.gif">');
document.write('<img src="images/digi_dp.gif">');
document.write('<img name="sekundenZehner" src="images/digi0.gif">');
document.write('<img name="sekundenEiner" src="images/digi0.gif">');
ziffern = Array(10);
for(var i = 0; i < 10; i++) {
 ziffern[i] = new Image;
 ziffern[i].src = 'images/digi' + i + '.gif';
 }
 timerID = setTimeout('uhrAktualisieren()', 1000);   
 }
function uhrAktualisieren() {
var zeit = new Date();
var stunden = zeit.getHours();
var minuten = zeit.getMinutes();
var sekunden = zeit.getSeconds();
document.stundenZehner.src = ziffern[Math.floor(stunden / 10)].src;
document.stundenEiner.src = ziffern[stunden % 10].src;
document.minutenZehner.src = ziffern[Math.floor(minuten / 10)].src;
document.minutenEiner.src = ziffern[minuten % 10].src;
document.sekundenZehner.src = ziffern[Math.floor(sekunden / 10)].src;
document.sekundenEiner.src = ziffern[sekunden % 10].src;
timerID = setTimeout('uhrAktualisieren()', 1000);    
}
</script>
<script language="JavaScript">
uhrEinfuegen();
</script>

Code Javascript Balken-Uhr:

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<style type="text/css">
.tbl { border: 2px solid #000; background: #5F5F5F; }
.inline
{ border: 1px solid #000; padding-left: 3px; padding-right: 3px; vertical-align: middle; }
.text
{ color: #E0E0E0; font-size: 12px; vertical-align: middle; padding-left: 2px; border: 1px solid #000; }
input.zahl
{ background: #E0E0E0; font-size: 14px; vertical-align: middle; text-align: center; width: 30px; }
input.time
{ background: #E0E0E0; color: #00E090; font-size: 16px; font-weight: bold; text-align: center; width: 150px; }
input.balken
{ background: #E0E0E0; font-size: 12px; font-weight: bold; border: none; text-align: left;
width: 410px;
}
</style>

Code für den HEAD-Bereich:

[Vor dem /HEAD|Bereich CSS]

<script language="JavaScript" type="text/javascript">
<!-- Beginn Balkenuhr
function BalkenUhr() {
var ZeitJetzt = new Date();
var units = ("|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||");
var StundenJetzt = ZeitJetzt.getHours();
var MinutenJetzt = ZeitJetzt.getMinutes();
var SekundenJetzt = ZeitJetzt.getSeconds();
document.getElementById("hours").value = units.substr(0, StundenJetzt);
document.getElementById("minutes").value = units.substr(0, MinutenJetzt);
document.getElementById("seconds").value = units.substr(0, SekundenJetzt);
if (StundenJetzt < 10)
StundenJetzt = "0" + StundenJetzt;
if (MinutenJetzt < 10)
MinutenJetzt = "0" + MinutenJetzt;
if (SekundenJetzt < 10)
SekundenJetzt = "0" + SekundenJetzt;
document.getElementById("Std").value = StundenJetzt;
document.getElementById("Min").value = MinutenJetzt;
document.getElementById("Sec").value = SekundenJetzt;
document.getElementById("Zeit").value = StundenJetzt + ":" + MinutenJetzt + ":" + SekundenJetzt + " Uhr";
window.setTimeout("BalkenUhr()", 1000);
}
window.setTimeout("BalkenUhr()", 2000);
//  Ende Balkenuhr -->
</script>

Code für das HTML-Objekt:

[Objekt HTML]

<form id="Balkenuhr">
<table
class="tbl" cellspacing="0" cellpadding="3"><tr>
<td class="text" align="left">Stunden:</td>
<td class="inline"><input class="zahl" readonly style="color:#FF7F00" type="text" id="Std"></td>
<td class="inline"><input readonly class="balken" type="text" id="hours" style="color:#FF7F00"></td>
</tr><tr>
<td class="text" align="left">Minuten:</td>
<td class="inline"><input class="zahl" readonly style="color:#00C070" type="text" id="Min"></td>
<td class="inline"><input readonly class="balken" type="text" id="minutes" style="color:#00C070"></td>
</tr><tr>
<td class="text" align="left">Sekunden:</td>
<td class="inline"><input class="zahl" readonly style="color:#0090E0" type="text" id="Sec"></td>
<td class="inline"><input readonly class="balken" type="text" id="seconds" style="color:#0090E0"></td>
</tr><tr>
<td class="text" align="left">Zeit:</td>
<td
align="center" colspan="2"><input class="time" readonly type="text" id="Zeit"></td>
</tr></table></form>

Feedbacks zu ""

es gibt insgesamt 0 Kommentar(e)



Name*
Vorname
Kommentar*
Email *
Homepage
Telefon
Sicherheitscode *
 
Logo HTML5
Button Spenden

© 2009 - 2018




  Besucher Statistik
 » 13 Online
 » 175 Heute
 » 175 Woche
 » 3930 Monat
 » 29754 Jahr
 » 276332 Gesamt
Rekord: 1420 (10.04.2014)
Zurück zum Seiteninhalt | Zurück zum Hauptmenü