Plugin-Uhr mit Datumsanzeige
#1 Plugin-Uhr mit Datumsanzeige
So, nun dürft ihr mir Schritt für Schritt erklären wie ich eine Uhr erstellen kann.
Mario schrieb : "Nehmt irgendein Script. Irgendeines."
Nicht böse sein ,wenn ich gaaaanz dumm frage
1. Wo nehme ich irgendein Script her?
2.Wenn ich das, was Mario gepostet hat ,so schreibe ist es dann doch noch nicht fertig. Oder?
3.Hätte ich gerne die Farbe Türkis für meine Uhr.
4.Wenn ich KEIN Datum möchte ,lasse ich die Zeilen für Tag , Monat und Jahr weg ?
5.Wie sieht ein Basis-Script aus?
Ich frage nach ,damit ich was lerne
#2 RE: Plugin-Uhr mit Datumsanzeige
Hi Bea,
mit "Irgendein Scrpit" ist gemeint,
daß es ganz einfach ist ein Plugin zu erstellen wenn man ein Script schon eingebaut hat und dieses liber als Plugin hätte.
Hier geistern ja immer wieder tolle Scripts durchs Forum,
die meistens nur in die Kopf- oder Fußzeile eingebaut werden müssen.
Um solche Teile geht es für den Anfang.
Tolle Scripte findet man auch viel im Netz.
Dort gibt es viele Sammlungen für nützliche oder lustige Funktionen.
Manche kann man einfach kopieren,
andere muss man anpassen.
Wenn du das von Mario nun in die Kopf- oder Fußzeile einbaust,
so hast du die Uhr schon oben oder unten in deinem Forum.
Wegen der Farben muss man etwas ändern.
Das kann ich aber nicht blind aus dem Ärmel schütteln sondern muss das testen.
Könnte ich morgen machen.
Oder jemand ist heute schneller ;-)
Wenn du nur die Uhrzeit haben willst, so muss 1 Zeile verändert werden.
3 weitere Zeilen wären dann überflüssig.
Sie könnten gelöscht werden, müssen aber nicht.
Hier mal der Code für die Uhrzeit:
2
3
4
5
6
7
8
9
10
11
12
13
<script type='text/javascript'>
<!--
var Datum = new Date();
var Stunden = Datum.getHours();
var Minuten = Datum.getMinutes();
if (Minuten <10)
{
Minuten= "0" + String(Minuten); // 0 einfuegen, falls Minuten <10
}
document.write(Stunden + ":" + Minuten + " Uhr");
//-->
</script>
Einfach mal in Kopf- oder Fußzeile (oder auch beides) rein kopieren und speichern.
Das ist der Ausgangspunkt.
Wenn wir hier gemeinsam Schritt für Schritt ein Plugin machen (ich könnte das im Hintergrund auch alleine für dich machen),
welches dann auch nach deinem Wünschen einstellbar ist,
so fände ich das ein tolles Thema um die Vorgehensweise zu demonstrieren.
Dabei muss man aber zwischen der Arbeit am Script und der Arbeit am Plugin unterscheiden.
Plugins erstellt man recht einfach.
Um den Code anzupassen, muss man ein wenig wissen wie das geht.
Aber dafür gibt es hier ja reichlich helfende Leute.
Bevor man am Script arbeitet, müste man wissen wo im Forum die Uhr erscheinen soll.
Davon hängt ab was man im Pluginsystem wählt.
Oder willst du die Uhr Pixel für Pixel frei positionieren können?
Dann wäre das im Plugin nicht so wichtig aber der Code muss dementsprechend vorbereitet werden.
Ja, wer die Wahl hat ,hat die Qual!
Machen wir doch beide!
Zuerst das leichtere.
Hier ein Foto von meiner Wunschuhr. 
Ich frage nach ,damit ich was lerne
Dieses Script liefert aber keine Liveanzeige der Uhrzeit.
Es zeigt immer nur die aktuelle Zeit wenn du die Seite aktualisierst.
Ansonsten bleibt die Zeit stehen.
Wollte ich nur erwähnt haben.
Falls du das Script dann doch nicht haben willst.
Sekunden werden damit dann auch nicht angezeigt.
Wäre zwar möglich aber in dem Fall unsinnig.
Ich habe im Netz ein Script gefunden das eine Live-Uhrzeit anzeigt.
Zitat
<html>
<head>
<title>Uhrscript</title>
<script type="text/javascript">
function uhrzeit(anzeige) {
Heute = new Date();//Es wird ein neues Datum angelegt.
Stunde = Heute.getHours();//Die Variable Stunde wird erstellt
Minute = Heute.getMinutes();//Die Variable Minute wird erstellt
Sekunde = Heute.getSeconds();//Die Variable Sekunde wird erstellt
document.getElementById("uhr").innerHTML=Stunde+":"+((Minute<=9)?"0"+Minute:Minute)+":"+((Sekunde<=9)?"0"+Sekunde:Sekunde)+" Uhr";
//Die Ausgabe ist so eingestellt, dass wenn die Minuten oder Sekunden niedriger als 10 sind, automatisch eine 0 vorrangestellt wird.
}</script>
</head>
<body onLoad="uhrzeit('jetzt'); setInterval('uhrzeit()', 1000)"> <!-- ist wichtig , funktion wird aufgerufen und ein interval gesetzt →
<p>Die aktuelle Uhrzeit:
<div id="uhr"><!-- Hier erscheint die Uhrzeit, da getElementById →</div>
</p>
</body>
</html>
In dem Code sehe ich, daß ein Teil in den Head-Bereich der Seite gehört.
Dafür gibt es in der Administration den Teil "Kopfbereich Addon".
Admin - Layout - Farben & Einstellungen - Funktionen an/aus
Dort habe ich den ersten Teil rein kopiert.
Zitat
<title>Uhrscript</title>
<script type="text/javascript">
function uhrzeit(anzeige) {
Heute = new Date();//Es wird ein neues Datum angelegt.
Stunde = Heute.getHours();//Die Variable Stunde wird erstellt
Minute = Heute.getMinutes();//Die Variable Minute wird erstellt
Sekunde = Heute.getSeconds();//Die Variable Sekunde wird erstellt
document.getElementById("uhr").innerHTML=Stunde+":"+((Minute<=9)?"0"+Minute:Minute)+":"+((Sekunde<=9)?"0"+Sekunde:Sekunde)+" Uhr";
//Die Ausgabe ist so eingestellt, dass wenn die Minuten oder Sekunden niedriger als 10 sind, automatisch eine 0 vorrangestellt wird.
}</script>
Ob und wie man das in ein Plugin stecken kann (ob das System das schon hergibt), weiß ich nicht.
Den zweiten Teil habe ich in die Kopfzeile kopiert und um Farbe und Größe erweitert.
2
3
4
5
<body onLoad="uhrzeit('jetzt'); setInterval('uhrzeit()', 1000)"> <!-- ist wichtig , funktion wird aufgerufen und ein interval gesetzt -->
<p>Die aktuelle Uhrzeit:
<div id="uhr" style="font-size:26; color:#04B4AE"><!-- Hier erscheint die Uhrzeit, da getElementById --></div>
</p>
</body>
Damit habe ich im Testforum schonmal eine funktionierende Uhr.
http://meerwasserverein-taucherforum.xobor.de/
Den Kopfzeilen Bereich in ein Plugin zu packen und einstellbar zu machen ist leicht.
Wäre halt zu klären ob das mit dem Kopfbereich Addon auch geht.
Bea, wäre das so wie du es dir ungefähr vorstellst?
Nur als Info
document.write(Stunden + ":" + Minuten + " Uhr");
Ist absolut Falsch
Sollte sowas in neu eingereichten Plugins auftreten, werden diese sofort zurückgewiesen.
Hier ein wenig Infos was das document Object ist
http://de.selfhtml.org/javascript/objekte/document.htm
Um mittels JavaScript etwas auf die Seite zu schreiben, muss immer ein bestimmter Bereich definiert werden (Div,Span usw.) und explizit in diese geschrieben werden.
Wir empfehlen im allgemeinen dafür jQuery.
Danke für den Hinweis.
Das ist die Gefahr bei nicht eigenen Scripten
wenn man sie nicht versteht und einfach übernimmt.
Dessen bin ich mir durchaus bewusst.
Im gefunden Script wurde es dann auch korrekt gemacht.
Aber die Funktion war langsam beim laden und verursachte kleine Fehler.
Ich habe ein neues Script gefunden.
Dies erstellt einen Button und ersetzt die Beschriftung mit der Uhrzeit.
Im Kopfbereich Addon muss nichts eingetragen werden.
Probleme mit andere Scripten konnte ich bisher auch nicht entdecken.
Nun versuche ich es umzuschreiben.
Farben und Größen und auch die Darstellung ohne Button.
Hier mal das Basis-Script:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<!-- präsentiert von kostenlose-javascripts.de -->
<script type='text/javascript'>
<!--
function uhrzeit() {
var zeit1 = new Date();
var stunden1 = zeit1.getHours();
if (stunden1 <10) {stunden1= "0"+stunden1;}
var minuten1 = zeit1.getMinutes();
if (minuten1 <10) {minuten1= "0"+minuten1;}
var sekunden1 = zeit1.getSeconds();
if (sekunden1 <10) {sekunden1= "0"+sekunden1;}
document.getElementById('uhrbutton').value = stunden1+":"+minuten1+":"+sekunden1;
timerid = setTimeout("uhrzeit()", 1000)
}
document.write('<input type="button" id="uhrbutton" value="00:00:00">');
//-->
</script>
<br />
<br />
<script type="text/javascript">uhrzeit();</script>
<!-- präsentiert von kostenlose-javascripts.de -->
PS: ich habe alle Variablennamen mit einer "1" erweitert, weil ich bei anderen Testscripten die gleichen Variablennamen drin habe.
Auch das ist ein häufiges Problem.
Nicht eindeutige Namen.
Das ist noch immer falsch.
noch immer verwendest du document.write
Stimmt leider.
Bevor ich noch weitere Schnipsel poste,
werde ich mal schauen wie das umzuschreiben ist.
Hmm, wir rutschen zwar komplett ins OT
aber ich verstehe nicht was am document.write generell falsch oder unerwünscht sein sollte.
Geh doch mal auf eine Seite deiner Wahl ... öffne die JS-Console deines Brwoser und tippe mal document.write('Alles weg')
ein
"TypeError: document.write is not a function"
Was sagt mir das?
In allen Anleitungen wo ich Variablen im HTML ausgeben will.
wird in den Funktionen document.write verwendet.
Auf den SelfHTML-Seiten bin ich oft.
Dieser Befehl wird innerhalb der Funktion ausgeführt.
Geschrieben wird das Ergebnis dann mit "Funktionsname()"
Und es funktioniert ja auch ohne Probleme.
Ich stehe echt auf dem Schlauch.
Dann hast du dich vertippe
2
3
document.write('Alles weg')
einfach das auf dieser Seite hier z.B. eingeben und ob das in einer Function aufgerufen wird ist vollkommen egal
kannst auch das machen
2
3
4
5
6
7
function boese() {
document.write('Alles weg')
}
boese();
selbe Ergebnis
Mit document.write beschreibst bzw. überschreibst du die oberste Ebene im DOM
#15 RE: Plugin-Uhr mit Datumsanzeige
Ich steige immer noch nicht durch.
Ich kenne die JS-Konsole nicht.
Also gegoogelt.
Strg+Shift+J
Unten habe ich deine Zeile eingegeben (kopiert).
Ausser der Meldung passiert nichts.
Dann habe ich dein böses Script im Testforum in die Kopfzeile gesetzt.
Nix Passiert ausser daß alles als Text oben ausgegeben wird.
Das war mir auch klar.
also habe ich den Funktionsbereich in Script eingeschlossen.
2
3
4
5
6
<script type='text/javascript'>
function boese() {
document.write('Alles weg')
}
boese();
</script>
Ergebnis:
Oben steht nun "Alles weg"
Mehr passiert nicht.
Und das ist doch ok, oder?
Ähnliche Themen
Jetzt anmelden!
Jetzt registrieren!