Bannerrotation durch Seitenwechsel! Aktualisiert 07.11.21
In der hier vorgestellten Bannerrotation können Bilder, Texte oder auch komplette HTML-Codes enthalten sein. Bei jedem Seitenwechsel oder erneuten Seitenaufruf wird das Banner gewechselt. Wichtig! Im Banner-Code der Zeilen 9-12 darf kein Absatz vorhanden sein!
Die Bannerrotation muß nicht immer zur Werbung eingesetzt werden, sie kann auch allgemein als Informationslieferant für Homepages und Foren dienlich sein!
Werden mehr als 3 Banner eingesetzt, muss die Zahl der Variablen für jedes weitere Banner um 1 erhöht werden (ab Zeile 12 + Zeile 14)!
Das Startbanner [0] steht in Zeile 9!
Zeile 9-12 müssen auf das eigene Forum angepasst werden!
<!--Nur wenn JQuery nicht vorhanden ist, die kommentierenden Zeichen am Anfang und am Ende (Zeile 2) löschen--> <!--<script type="text/javascript" src="https://img.homepagemodules.de/ds/static/jquery/min/jquery-1.7.1.min.js"></script>-->
<script LANGUAGE="JavaScript"> $(document).ready(function(){ var num = 0; //Bestimmt das Startbanner
Banner = new Array(num); Banner[0] = '<a title="Das Forum für Hilfe, Tricks & Tipps" href="https://www.hilfe-tricks-tipps.de/forum.php" target="_blank" rel="noopener noreferrer"><img src="https://addpics.com/files/6v-49-21f0.jpg" border=0 alt="Das Forum für Hilfe, Tricks & Tipps"></a><br>'; Banner[1] = '<a title="Das Forum-Portal für Hilfe, Tricks & Tipps" href="https://www.hilfe-tricks-tipps.de/" target="_blank" rel="noopener noreferrer"><img src="https://addpics.com/files/6v-47-549b.jpg" border=0 alt="Das Forum für Hilfe, Tricks & Tipps"></a><br>'; Banner[2] = '<a title="Das Forum-Talk für Hilfe, Tricks & Tipps" href="https://www.hilfe-tricks-tipps.de/treetalk.php" target="_blank" rel="noopener noreferrer"><img src="https://addpics.com/files/6v-48-f0fe.jpg" border=0 alt="Das Forum für Hilfe, Tricks & Tipps"></a><br>'; // Banner[3] = 'Banner4'; //Variable muss bei weiteren Bannern um jeweils 1 erhöht werden!
var num = new Date().getSeconds()%3; //Variable muss bei weiteren Bannern um jeweils 1 erhöht werden! document.getElementById('Bannerw').innerHTML = Banner[num]; });
Bannerchange für Homepage und Forum Aktualisiert 28.01.19
Um seine Webseite bekannt zu machen, besteht auch die Möglichkeit über spezielle Anbieter sein Bannner auszutauschen. Es ist auch so, dass man vorher die Kategorie des anderen Banners auswählen kann.
In der hier vorgestellten Bannerrotation wechseln die Bilder nach einer vorbestimmten Zeit.
Es können Bilder ("image"), Links ("link") und die Linkbeschreibung ("text") enthalten sein.
Die Zeit kann in Zeile 40 (hier 7 Sekunden) angepasst werden.
In Zeile 50 kann das Banner auf eine Höhe angepasst und zusätzlich formatiert werden.
Die "Beschreibung" der Banner kann in Zeile 52 beliebig formatiert werden.
Durch hinzufügen von "document.ready" (Zeile 44+46) kann das Script eine beliebige Stelle einnehmen (jQuery erforderlich, Zeile 1)!
Die Banner-Links sind so aufgebaut, dass sie in einem neuen Fenster öffnen (target="_blank")! Linksicherheit mit rel="noopener noreferrer" ist berücksichtigt!
Sollen die Banner-Links im gleichen Fenster öffnen (target="_self"), müssen die Zeile 25, 26,37 + 38 gelöscht oder auskommentiert werden!
<!--Nur wenn JQuery nicht vorhanden ist, die kommentierenden Zeichen am Anfang und am Ende (Zeile 2) löschen--> <!--<script type="text/javascript" src="https://img.homepagemodules.de/ds/static/jquery/min/jquery-1.7.1.min.js"></script>-->
<script type="text/javascript"> var image = new Array(); var link = new Array(); var text = new Array(); var a = 0;
image[a] = 'https://files.homepagemodules.de/b104774/f46t1197p2706n101_GnWCrTcu.png'; link[a] = 'https://www.dampferzuflucht.de'; text[a] = 'Das Dampfer Forum rund um die E Zigarette'; a++;
var targetchoice="_blank"; var relchoice="noopener noreferrer"; var num = (image.length); var zaehler = -1;
Die Banneranimation lässt sich jetzt auch per Mausklick auf den Kreis neu starten! Funktioniert in allen Templates und Mobil! Mobil wird sogar die Schriftgröße angepasst, Quer- und Hochformat bedacht!
Der gesamte Eintrag kann in die "Kopfzeile".
Weil der Schriftimport umstritten ist, habe ich ihn herausgenommen. Schriften aus dem Forum sind, denke ich, ausreichend!
In Zeile 14-16 wird die Schriftgröße für die Mobil-Version angepasst, auch Quer- und Hochformat bedacht.
In Zeile 103 wird per onclick die Animation neu gestartet! Auf die Schnelle mit Seiten-Reload. Schöner wäre ein Neustart mit "@keyframes".....
Damit das Banner nicht ruckelt, sollten Zeile 81+84 den Wert aus Zeile 46+56+10px (border) aufweisen (85px + 100px +10px =195 px)