Java Script : Grafik und Banner Rotation








Zurück zur Java Scripts-Hauptseite.

Dies Script kann verschiedene Grafiken z.B. Banner abwechselnd rotieren lassen. Die Anzeigenlänge ist einstellbar und bei einem Klick kommt man auf die entsprechende Seite.

Folgenden Script-Code in die Webseite einfügen:

Die Grafiken und zugehörigen Webseiten URLs werden unter Banner[x] und URL[x] eingetragen. x steht hierbei immer für eine Zahl, wobei zusammengehörende Grafiken und URLs dieselbe Zahl bekommen. Die Einträge beginnen mit 1 und müssen dann fortlaufend durchnummeriert werden. In dieser Reihenfolge werden die Grafiken dann auch angezeigt. Sollen mehr als 3 Grafiken rotieren, sind weitere Einträge nach gleichem Muster hinzuzufügen.

Bei Anzahl=3; ist die Gesamtanzahl der Grafiken einzutragen. Diese ist gleich mit der höchsten Nummer, welche für Banner[x] und URL[x] vorher vergeben wurde.

Bei Zeit = 5; kann die Anzeigendauer in Sekunden eingestellt werden.

Die Konfigurationsmöglichkeiten für das neue Fenster werden über die Zeile window.open(URL[i],i,'toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1, fullscreen=0,width=800,height=600,top=0,left=0'); eingestellt. Erlaubt sind die Einträge 0 für nein und 1 für ja, sowie die Angaben für Breite (width), Höhe (height), Position von links (left) und Position von oben (top) des Anzeigenfensters in Pixeln.





Funktionsaufruf: HTML-Code ist im <BODY>-Tag einzufügen



Der Start der Funktion erfolgt automatisch über den Event-Handler onload, der im Body-Tag eingebaut werden muß. Eine Konfiguration ist hierzu nicht nötig.




Nachfolgenden Code in den Body-Bereich einbauen, wo die Grafiken erscheinen sollen:



Hier ist aus Kompabilitätsgründen noch einmal das erste Banner einzutragen. <a href="javascript:bannerklick();"><img SRC="banner1.gif" name="banner" border="0"></a>

Sollten hier zusätzlich Angaben zur Größe oder ein alternativer Text eingegeben werden, so gilt das für alle Grafiken in der Rotation.

Demonstration:





Kontaktformular - Copyrighthinweis und Impressum
zurück zur vorherigen Seite (nur mit Java Script)