Gunnar Bittersmann: Für jeden Monat ein eigenes Hintergrundbild

Beitrag lesen

@@Frechdachs:

nuqneH

<script language=javascript>

Welche HTML-Version verwendest du? Bei HTML 4.01/XHTML 1.x ist @type="text/javascript" erforderlich; bei (X)HTML5 nicht mehr. Das @language-Attribut ist auf jeden Fall sinnlos.

var monat = aktDatum.getMonth()+1;

Tja, JavaScript begeht (wie andere Umgebungen auch) die Dummheit, Montage von 0 bis 11 zu zählen.

Aber wenn das schon mal so ist, kann man sich diesen Index auch gleich zunutze machen und die Bilddateinamen im Array auch von 0 bis 11 zählen lassen …

var noi = 12;
bild = new Array(noi+1);

… also nicht 1 addieren. Die Angabe der Größe eiens Arrays ist in JavaScript übrigens nicht erforderlich.

Und <http://de.selfhtml.org/javascript/sprache/variablen.htm@title=globale Variablen> sind pfui.

bild[1] = 'januar.jpg';
bild[2] = 'februar.jpg';
bild[3] = 'maerz.jpg';
bild[4] = 'april.jpg';
bild[5] = 'mai.jpg';
bild[6] = 'juni.jpg';
bild[7] = 'juli.jpg';
bild[8] = 'august.jpg';
bild[9] = 'september.jpg';
bild[10] = 'oktober.jpg';
bild[11] = 'november.jpg';
bild[12] = 'dezember.jpg';

Dafür kannst du auch kürzer schreiben (Index von 0 bis 11):

var bild = ['januar.jpg', 'februar.jpg', 'maerz.jpg', 'april.jpg', 'mai.jpg', 'juni.jpg', 'juli.jpg', 'august.jpg', 'september.jpg', 'oktober.jpg', 'november.jpg', 'dezember.jpg'];

document.getElementByTagName('body').style.backgroundImage= 'url('+ bild[monat]+')';

Und hier tritt der von Alex erwähnte Fehler auf. Allerdings ist es sinnlos, sich das 'body'-Element auf diese Weise aus dem DOM rauszusuchen; es steht bereits mit document.body zur Verfügung.

//-->

HTML-Kommentare haben in JavaScript-Code nichts zu suchen, weg damit!

<body onload=bgwechsel()>

Die Anführungszeichen um Attributwerte dürfen nur unter ganz bestimmten Bedingungen entfallen. [HTML401 §3.2.2] Diese sind hier nicht gegeben.

Was ist eigentlich, wenn kein JavaScript ausgeführt wird? Kein Hintergrundbild?

Ich würde das ganze aber doch eher anders lösen und nicht JavaScript und CSS vermischen. Mit JavaScript setzt du lediglich eine Klasse:

document.body.className += ' month' + (new Date().getMonth() + 1);

und notierst die Bilder im Stylesheet:

body {background: url(fallback.jpg)} /* Hintergrundbild, wenn kein JavaScript ausgeführt wird */  
body.month1 {background: url(januar.jpg)}  
body.month2 {background: url(februar.jpg)}  
body.month3 {background: url(maerz.jpg)}  
body.month4 {background: url(april.jpg)}  
body.month5 {background: url(mai.jpg)}  
body.month6 {background: url(juni.jpg)}  
body.month7 {background: url(juli.jpg)}  
body.month8 {background: url(august.jpg)}  
body.month9 {background: url(september.jpg)}  
body.month10 {background: url(oktober.jpg)}  
body.month11 {background: url(november.jpg)}  
body.month12 {background: url(dezember.jpg)}

Qapla'

--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)