Wechselnder Header

Um die Hintergrundbilder für den Header in einem bestimmten Zeitabstand durchzuwechseln, kannst du folgenden Code verwenden:

<script type="text/javascript">// <![CDATA[
function changeImage(cont, images, intervall) {
this.container = document.getElementById(cont);
this.counter = 0;
this.change = function() {
this.container.style.background = "url(" + images[this.counter] + ")";
if (this.counter == (images.length - 1)) { this.counter = 0; } else { this.counter++; }
_this = this;
window.setTimeout(function() { _this.change(); }, intervall * 1000);
}
this.change();
}
window.onload=function(){
var images = new Array("https://storage.yooco-static.de/storage/header.png", "https://storage.yooco-static.de/storage/header2.png");
var change = new changeImage("head", images, 2);
};
// ]]></script>

Alles, was rot markiert ist, kann geändert werden

• Die Adressen sind die URLs der Hintergrundbilder, sie müssen in Anführungszeichen und per Komma getrennt angegeben werden
• Es können beliebig viele Bildadressen angegeben werden, aber man sollte Rücksicht auf die Seitenladezeiten nehmen
• Die rot markierte Zahl steht für die Zeit in Sekunden bis jeweils das nächste Bild erscheint
• Alternativ können mit dem ersten Parameter der changeImage-Funktion auch andere Bereiche wie die Navi o.ä. angesprochen werden