Hallo , also ich habe hier einen scriptcode den ich mir auch selber ausgedacht habe um eine Balkenuhr zu erstellen.
Mit folgendem Code:
<html>
<head>
<title> Strichuhr </title>
<style type="text/css">
input.strich {
color: #FF0080;
background: #000040;
border: none;
font-weight:bold;
}
#rand {
border-collapse: collapse;color: #00FFFF;font-weight:bold;
}
#rand td {
border: 2px solid #80FFFF;
}
</style>
<script type="text/javascript">
function meineUhr() {
var ZeitHeute = new Date();
var Striche = ("|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||");
var StundenJetzt = ZeitHeute.getHours();
var MinutenJetzt = ZeitHeute.getMinutes();
var SekundenJetzt = ZeitHeute.getSeconds();
var JahrJetzt = ZeitHeute.getFullYear();
var MonatJetzt = ZeitHeute.getMonth()+1;
var TagJetzt = ZeitHeute.getDate();
document.getElementById("Stundenanzahl").value = Striche.substring(0, StundenJetzt);
document.getElementById("Minutenanzahl").value = Striche.substring(0, MinutenJetzt);
document.getElementById("Sekundenanzahl").value = Striche.substring(0, SekundenJetzt);
document.getElementById("Jahresanzahl").value = JahrJetzt
document.getElementById("Monatsanzahl").value = Striche.substring(0, MonatJetzt);
document.getElementById("Tagesanzahl").value = Striche.substring(0, TagJetzt);
if (StundenJetzt < 10)
StundenJetzt = "0" + StundenJetzt;
if (MinutenJetzt < 10)
MinutenJetzt = "0" + MinutenJetzt;
if (SekundenJetzt < 10)
SekundenJetzt = "0" + SekundenJetzt;
if (JahrJetzt < 10)
JahrJetzt = "0" + JahrJetzt;
if (MonatJetzt < 10)
MonatJetzt = "0" + MonatJetzt;
if (TagJetzt < 10)
TagJetzt = "0" + TagJetzt;
document.getElementById("Stunden").value = StundenJetzt;
document.getElementById("Minuten").value = MinutenJetzt;
document.getElementById("Sekunden").value = SekundenJetzt;
document.getElementById("Jahre").value = JahrJetzt;
document.getElementById("Monate").value = MonatJetzt;
document.getElementById("Tage").value = TagJetzt;
document.getElementById("Zeit").value = StundenJetzt + ":" + MinutenJetzt + ":" + SekundenJetzt + " Uhr";
document.getElementById("Datum").value = TagJetzt + "." + MonatJetzt + "." + TagJetzt;
setTimeout ("meineUhr()", 1000);
}
setTimeout("meineUhr()", 2000);
</script>
</head>
<body onload="meineUhr()">
<br>
<h1> Datum </h1
<br><br>
<form id="Strichuhr">
<table id="rand" cellspacing="0" cellpadding="4" border="0" bgcolor="#000040" >
<tr>
<td>Jahr:</td>
<td><input readonly style="color:#800000" type="text" id="Jahre" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Jahresanzahl" size="40" style="color:#800000"></td>
</tr>
<tr>
<td>Monat:</td>
<td><input readonly style="color:#FFFF00" type="text" id="Monate" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Monatsanzahl" size="40" style="color:#FFFF00"></td>
</tr>
<tr>
<td>Tag:</td>
<td><input readonly style="color:80FF00" type="text" id="Tage" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Tagesanzahl" size="40" style="color:80FF00"></td>
</tr>
</table>
</form>
<br>
<br>
<br>
<h1> Uhrzeit </h1>
<br><br>
<form id="Strichuhr">
<table id="rand" cellspacing="0" cellpadding="4" border="0" bgcolor="#000040" >
<tr>
<td>Stunden:</td>
<td><input readonly style="color:#800000" type="text" id="Stunden" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Stundenanzahl" size="40" style="color:#800000"></td>
</tr>
<tr>
<td>Minuten:</td>
<td><input readonly style="color:#FFFF00" type="text" id="Minuten" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Minutenanzahl" size="40" style="color:#FFFF00"></td>
</tr>
<tr>
<td>Sekunden:</td>
<td><input readonly style="color:80FF00" type="text" id="Sekunden" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Sekundenanzahl" size="40" style="color:80FF00"></td>
</tr>
<tr>
<td>Zeit:</td>
<td colspan="2"><input readonly type="text" id="Zeit" size="40" style="color:#FF8000"class="strich"></td>
</tr>
</table>
</form>
</body>
<html>
auf internet explorer funktioniert das Ganze auch.Meine Frage ist nun, ob es eine Möglichkeit gibt , dass ganze ohne die funktion. getElementbyid zu bewerkstelligen.Wäre nett wenn mir jemand helfen könnte.
Mit folgendem Code:
<html>
<head>
<title> Strichuhr </title>
<style type="text/css">
input.strich {
color: #FF0080;
background: #000040;
border: none;
font-weight:bold;
}
#rand {
border-collapse: collapse;color: #00FFFF;font-weight:bold;
}
#rand td {
border: 2px solid #80FFFF;
}
</style>
<script type="text/javascript">
function meineUhr() {
var ZeitHeute = new Date();
var Striche = ("|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||");
var StundenJetzt = ZeitHeute.getHours();
var MinutenJetzt = ZeitHeute.getMinutes();
var SekundenJetzt = ZeitHeute.getSeconds();
var JahrJetzt = ZeitHeute.getFullYear();
var MonatJetzt = ZeitHeute.getMonth()+1;
var TagJetzt = ZeitHeute.getDate();
document.getElementById("Stundenanzahl").value = Striche.substring(0, StundenJetzt);
document.getElementById("Minutenanzahl").value = Striche.substring(0, MinutenJetzt);
document.getElementById("Sekundenanzahl").value = Striche.substring(0, SekundenJetzt);
document.getElementById("Jahresanzahl").value = JahrJetzt
document.getElementById("Monatsanzahl").value = Striche.substring(0, MonatJetzt);
document.getElementById("Tagesanzahl").value = Striche.substring(0, TagJetzt);
if (StundenJetzt < 10)
StundenJetzt = "0" + StundenJetzt;
if (MinutenJetzt < 10)
MinutenJetzt = "0" + MinutenJetzt;
if (SekundenJetzt < 10)
SekundenJetzt = "0" + SekundenJetzt;
if (JahrJetzt < 10)
JahrJetzt = "0" + JahrJetzt;
if (MonatJetzt < 10)
MonatJetzt = "0" + MonatJetzt;
if (TagJetzt < 10)
TagJetzt = "0" + TagJetzt;
document.getElementById("Stunden").value = StundenJetzt;
document.getElementById("Minuten").value = MinutenJetzt;
document.getElementById("Sekunden").value = SekundenJetzt;
document.getElementById("Jahre").value = JahrJetzt;
document.getElementById("Monate").value = MonatJetzt;
document.getElementById("Tage").value = TagJetzt;
document.getElementById("Zeit").value = StundenJetzt + ":" + MinutenJetzt + ":" + SekundenJetzt + " Uhr";
document.getElementById("Datum").value = TagJetzt + "." + MonatJetzt + "." + TagJetzt;
setTimeout ("meineUhr()", 1000);
}
setTimeout("meineUhr()", 2000);
</script>
</head>
<body onload="meineUhr()">
<br>
<h1> Datum </h1
<br><br>
<form id="Strichuhr">
<table id="rand" cellspacing="0" cellpadding="4" border="0" bgcolor="#000040" >
<tr>
<td>Jahr:</td>
<td><input readonly style="color:#800000" type="text" id="Jahre" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Jahresanzahl" size="40" style="color:#800000"></td>
</tr>
<tr>
<td>Monat:</td>
<td><input readonly style="color:#FFFF00" type="text" id="Monate" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Monatsanzahl" size="40" style="color:#FFFF00"></td>
</tr>
<tr>
<td>Tag:</td>
<td><input readonly style="color:80FF00" type="text" id="Tage" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Tagesanzahl" size="40" style="color:80FF00"></td>
</tr>
</table>
</form>
<br>
<br>
<br>
<h1> Uhrzeit </h1>
<br><br>
<form id="Strichuhr">
<table id="rand" cellspacing="0" cellpadding="4" border="0" bgcolor="#000040" >
<tr>
<td>Stunden:</td>
<td><input readonly style="color:#800000" type="text" id="Stunden" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Stundenanzahl" size="40" style="color:#800000"></td>
</tr>
<tr>
<td>Minuten:</td>
<td><input readonly style="color:#FFFF00" type="text" id="Minuten" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Minutenanzahl" size="40" style="color:#FFFF00"></td>
</tr>
<tr>
<td>Sekunden:</td>
<td><input readonly style="color:80FF00" type="text" id="Sekunden" size="2" class="strich" ></td>
<td><input readonly class="strich" type="text" id="Sekundenanzahl" size="40" style="color:80FF00"></td>
</tr>
<tr>
<td>Zeit:</td>
<td colspan="2"><input readonly type="text" id="Zeit" size="40" style="color:#FF8000"class="strich"></td>
</tr>
</table>
</form>
</body>
<html>
auf internet explorer funktioniert das Ganze auch.Meine Frage ist nun, ob es eine Möglichkeit gibt , dass ganze ohne die funktion. getElementbyid zu bewerkstelligen.Wäre nett wenn mir jemand helfen könnte.
Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von dersandkönigrockt ()