Tipp des Tages (31 Optionen)
 HomeDatum • Text des Tages Quelltext  Beispiel  Download 

Text des Tages - 1 von 31

Dieses JavaScript schreibt beim Laden der Seite, abhängig vom aktuellen Kalendertag des Monats, einen von 31 Texten in Ihre HTML-Seite. Die 31 Texte werden in einem Array abgelegt.
textanzeige datumsabhängig monatstermine tagestipp

Tipp des Tages (1 von 31)

Für jeden Tag des Monats soll ein Text ausgwählt und selektiv angezeigt werden. Die Texte für diese 31 unterschiedlichen Ausgaben stehen in einem Array.

Was ist ein Array?

Da lediglich 31 Texte bereitgehalten werden, beginnt die Ausgabe der Texte zu jedem Monatsbeginn mit dem ersten Text. Am 2. Tag wird der zweite Text angezeigt usw. . Die Texte werden also monatlich wiederholt.

JavaScript schreibt einen Text in die Seite

Eine JavaScript-Anweisung schreibt den Text in die Seite, genauer in die definierte Box für die Anzeige. Aazu wird aus einem Array 1 von 31 Texten (datumsabhängig) ausgewählt.

Tagestext für heute,


Mehrzeiliger Textbereich für bis zu 8 Zeilen a ca 48 Zeichen (Diese Angabe gilt für die Schrifttype Verdana, 12 Pixel Höhe bei 120% Zeilenhöhe). Andere Textformatierungen erlauben entsprechend mehr oder weniger Text.

Datumsabhängiger Tagestipp für einen Monat, Tipp des Tages 31 Texte

Module mit ähnlichem Aufbau:

Textanzeige 1 von 7 wochentagsabhängig
Textrotation 02 - Kurztexte nacheinander automatisch anzeigen
Anzeige eines bis zu ca. 360 Zeichen langen Textes (8 Textzeilen)
Glückskeks-Spruch, Text des Tages für einen Monat, 1 von 31 (1 Textzeile)
Flugzeug-Banner, Text des Tages für einen Monat, 1 von 31, (2 Textzeilen)


Aufwand für den Webmaster




Aufgabe der Funktion

Das Script ermittelt den aktuellen Tag des laufenden Monats und 'sieht im Register nach' welcher Text dort für den betreffenden Tag abgelegt wurde. Die Ausgabe erfolgt mit der JavaScript-Anweisung innerHTML in der AnzeigeBox. Der Text wird also dort angezeigt, wo der Div-Bereich für die AnzeigeBox notiert wurde.

Der Array hat in meinem Beispiel den Namen 'msg[]'

Die Elemente dieses Arrays heißen msg[1] bis msg[31]



Das Script im Head-Bereich
<script type="text/javascript" language="JavaScript">
<!-- Begin

var TagesDatum = new Date();
var TagHeute = TagesDatum.getDate();

var msg = new Array();

msg[1] = "Tipp des Tages (1): Zitronen werden viereckig wenn ... ";
msg[2] = "Tipp des Tages (2): Lederschuhe einfrieren ...";
msg[3] = "Tipp des Tages (3): Kaffe wird schneller kalt wenn ...";

// und so weiter

msg[31] = "Tipp des Tages (31): Wasser staubt nicht wenn ...";


function TippSchreiben() {
document.getElementById('AnzeigeText').innerHTML = msg[TagHeute];
}

window.setTimeout("TippSchreiben()", 1000);

//  End -->
</script>


Die AnzeigeBox im BODY-Bereich

<div id="AnzeigeBox">
<div id="AnzeigeText"></div>
</div>
Formatierung der AnzeigeBox und der Box Für den Text

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

#AnzeigeBox {
position: relative;
left: 0px;
top: 0px;
width: 550px;
height: 250px;
margin: 0px;
padding: 0px;
background: url(bg01-tagestipp.png);
border: 1px solid #5F5F5F;
}

#AnzeigeText {
position: absolute;
left: 206px;
top: 47px;
width: 310px;
height: 121px;
margin: 0px;
padding: 0px;
font-family: Verdana,sans-serif;
color: #000000;
font-size: 12px;
font-weight: normal;
text-align: left;
line-height: 120%;
overflow: hidden;
}

-->
</style>


passende Grafiken für mrin Modul

bg01-tagestipp.png

Textanzeige Sprechblase TextBox mit CSS positionieren

... und weil es gerade regnet:  bg02-tagestipp.png

Textanzeige Sprechblase TextBox mit CSS positionieren

bg03-tagestipp.png

Textanzeige Sprechblase TextBox mit CSS positionieren




   Ihr Script testen

Wenn Sie das eingebundene Script für die verschiedenen Tage des Monats testen möchten, müssen die Kalendereinstellungen geändert werden:

Unten rechts auf dem Bildschirm wird (bei Windows) normalerweise die Uhrzeit angezeigt. Dort kann man rechtsklicken und Kalender und Zeit ver- / einstellen. Ist die Uhr nicht zu sehen:






Das könnte Sie auch interessieren: