Ich habe einen guten Ticker gefunden. Läuft sehr gut. Eines stört mich aber ein bißchen. Bei unterschiedliche Länge von Meldungen, sind die Kurzen nicht mittig. Kann man das so verändern, das der Text immer mittig ist?
<script language="JavaScript"> <!-- Start var newslist=new Array(); var cnt=0; // Aktive News var curr = ""; var i=-1; // Angewählter Buchstabe
newslist[0]=new Array("Unter 'News CB-Funk' sind Neuigkeiten über den '2.Osna Radio Activity Day' Contest zu finden!") newslist[1]=new Array("Teilnahmebedingungen siehe Contest") newslist[2]=new Array("Beispielmeldung 3") newslist[3]=new Array("Beispielmeldung 4")
function newsticker() { // Nächster Buchstabe der aktiven News if (i < newslist[cnt][0].length - 1) { i++; temp1 = newslist[cnt][0]; temp1 = temp1.split(''); curr = curr+temp1[i]; temp2 = newslist[cnt][1]; mtxt.innerHTML = ""+curr+"_"; setTimeout('newsticker()',150) //Laufspeed return; }
// Nächste News i = -1; curr = ""; if (cnt<newslist.length-1) cnt++; else cnt=0; setTimeout('newsticker()',5000) // Pause zwischen den News
Wechselnder News Ticker mit Web-Links und Mittenposition Aktualisiert 26.10.2015
Hallo Magister, das Script gefällt mir sehr gut!
Was der Ticker bereits kann:
Mehrere Ticker-Nachrichten sind möglich.
Pausen zwischen den Nachrichten und die Schnelligkeit des Tickers sind einstellbar!
Der Ticker wiederholt seine Nachrichten, fängt wieder von vorne an.
Die Ticker-Nachrichten sind über "style" formatierbar!
Ich habe das Script etwas erweitert, wodurch folgende zusätzliche Funktionen hinzu gekommen sind:
Jede Ticker-Nachricht kann verlinkt werden.
Der Ticker wird mittig angeordnet und startet trotzdem linksseitig!
Kurze oder lange Ticker-Nachrichten bleiben zentriert!
Die Breite des Textfeldes bleibt gleich!
Jede Nachricht kann einzeln formatiert werden!
Grundformatierung über CSS
Zu besseren Übersicht das komplette HTML-Script:
Auf folgendes ist zu achten:
Der Ticker wird über einen Body-Eintrag "onLoad" (Zeile 7) geladen.
Script und Ausgabe des Tickers findet Platz im "Body". Die Formatierungen unter "<style>...</style>" (Zeile 7-30), können auch in die vorhandene CSS eingetragen werden!
Bei vorhandenen onLoad-Eintrag, erweitern (z.B.: <body onLoad="newsticker(); xyzScript();">)
Im Ticker-Text müssen Anführungszeichen (") gegen Auslassungszeichen (') ersetzt werden.
In den Ticker-Zeilen (Zeile 44-47) sind jeweils 3 Informationen durch Anführungsstriche und Kommata getrennt --> newslist[0]=new Array("Text","Format","Link");
Im ersten Teil der Ticker-Zeile wird der Text eingegeben, ohne Anführungszeichen!
Im zweiten Teil der Ticker-Zeile kann man die Ticker-Nachricht formatieren! Wichtig ist hier die Angabe der Breite! Sie sollte so gewählt werden, dass kein Umbruch der Nachricht einsteht! Die Breite ist für die Zentrierung notwendig!
Im dritten Teil der Ticker-Zeile wird die Link-Adresse eingetragen
In Zeile 62 kann die Geschwindigkeit des Tickers eingestellt werden.
In Zeile 72 kann die Pause zwischen den Nachrichten bestimmt werden.
In Zeile 7-32 kann die Tickernachricht für die CSS beliebig formatiert werden!
Zeile 25-29 bestimmt den Hintergrund der Nachricht. Ist nicht immer notwendig!
Zeile 25 bestimmt die Gesamthöhe der Ticker-Nachricht. Ist nur notwendig, wenn unterschiedliche Schriftgrößen genutzt werden. Hierdurch wird ein Höhensprung der Webseite vermieden!
Zeile 19 bestimmt die Gesamtlänge des Textfeldes
Die Hover-Farbe wird in Zeile 15 bestimmt.
Wird nur Text, ohne zusätzliche Breitenbestimmung und Links im Ticker abgebildet, sieht die "newList-Zeile" (44-47) wie folgt aus: newslist[0]=new Array("Nachricht..........","","")
<script language="JavaScript"> // Tickereinstellungen var newslist=new Array(); var cnt=0; // Auswahl des Start-Tickers, hier newlist[0] var curr = ""; var i=-1;
newslist[0]=new Array("+++ Neue Weltzeituhr mit JQuery-Script, Datumausgabe und Localzeit +++","width:640px;","https://www.hilfe-tricks-tipps.de/t861f31-Weltzeituhr-Verschiedene-Zeiten-anzeigen.html#msg1898") newslist[1]=new Array("+++ Meine komplette Forum-Iconbar zum herunterladen +++","width:540px","https://www.hilfe-tricks-tipps.de/t916f31-Meine-komplette-Forum-Iconbar-zum-herunterladen.html#msg2077") newslist[2]=new Array("+++ Formatierbare Tooltipps +++","width:330px","https://www.hilfe-tricks-tipps.de/t168f31-Formatierbare-Tooltipps-oder-Quickinfos-in-Forumbeitraegen.html#msg300") newslist[3]=new Array("+++ Spenden-Button fürs Forum +++","width:330px !important;","https://www.hilfe-tricks-tipps.de/t720f31-Spenden-Button-fuers-Forum-einrichten.html")
Wolfgang 1. Die Schrift soll bei jedem Text die gleiche Größe haben. 2. Die Schriftfarbe, wo kann ich sie ändern? 3. Wenn der Text unterschiedliche Längen hat, ändert sich jedesmal das gesamte Textfeld. Mal länger mal kürzer, das sieht nicht so schön aus. Ich habe alles in einer Tabelle, die sich der Größe automatisch anpasst. Kann man da noch etwas machen?
Hallo Magister, habe das Script in Beitrag #2 nochmal überarbeitet. Die Breite des Textfeldes bleibt jetzt gleich! Unter "News Ticker in Aktion" kann man sehen, wie der News Ticker jetzt funktioniert!
Folgende Änderungen müsstest Du auf Deiner Webseite machen: 1. Änderung
2. Änderung Jetzt brauchst Du nur noch hinter den Nachrichen die ungefähre Breite des Tickers eintragen, sodas kein Umbruch entsteht.
1 2 3 4 5
newslist[0]=new Array("++Info's über den 2.Osna Radio Activity Day Contest unter 'News CB Funk!++","650px") newslist[1]=new Array("++Teilnahmebedingungen findet Ihr unter 'Contest 01.11.15++","500px") newslist[2]=new Array("++Osna Radio QRV ab 18.00 Uhr MEZ, auf FM Kanal 29 (27.295 Mhz)++","600px")
3. Änderung Die Breite der Tabelle sollte einen festen Wert haben (Ist nicht zwingend erforderlich)! Zu beachten: Die Breite des Textfeldes muss immer etwas länger sein, als die längste Nachricht!
1 2 3 4
width="64%" gegen z.B.: width="700px" tauschen (längster Text "newslist[0] => 650px")!