Boah, Newsticker sind doch so…. 2016

Avatar Datum: 29. April 2016
Autor: Benedikt Keller


Einige von uns haben sich ja schon die Augen gerieben: Der tot geglaubte Newsticker erhält bei vielen Kunden im Portal wieder Einzug. Leider kam es bei diversen Umsetzungen mit fertigen Tickern in letzter Zeit aber zu einigen Problemen.

Problem 1: Responsivität
Die Liste an fertigen Tickern im Netz ist lange und die Fähigkeiten der Ticker sind umfangreich, doch eines haben die meisten gemeinsam: Auf responsiven Seiten kommen sie nicht klar und verrechnen sich, sobald das Tablet geschwenkt oder das Browser-Fenster verändert wird.

Problem 2: CSS & IE
Neueste Trends gehen dahin, den Ticker per CSS3 zu animieren. An sich keine schlechte Idee, leider aber noch nicht praxistauglich, da der liebe Internet Explorer das nicht akzeptiert. Daher muss nach wie vor auf JS zurückgegriffen werden.

Problem 3: CSS & Tickerlänge
Kurioserweise werden viele Ticker neuerdings per CSS gebaut und die Länge des Tickers abhängig vom Anzeigefenster gemacht, nicht jedoch von der Textlänge. Dies geht bei kurzen Meldungen vielleicht gut, mit längeren Texten und kleinen Anzeigefenstern im responsiven kann das aber nicht funktionieren. Der Ticker bricht natürlich mitten im Text ab und beginnt von vorne.

Lösung
Daher habe ich nun bei meinen Projekten den Ticker durch einen eigenen JS-Ticker ersetzt. Dieser ist äußerst simpel aufgebaut und kann nur wenig. Aber er kann das, was er können muss: Er funktioniert in allen Browsern, stoppt beim Mouseover, berechnet sich anhand der tatsächlichen Textlänge und verrechnet sich vor allem im responsiven Verhalten nicht dauernd. Die Lösung ist also wie so oft: Selber bauen. Dauert meist nicht länger, als fertigen Code zu suchen und anzupassen.

Kommentare

Selber kommentieren:






Weitere Beiträge zum Thema Technologie


Fancybox: JS-Fehler mit jQuery 1.9+

Autor: Stefan Oswald


Technologie


Die letzte freie Version von Fancybox (1.3.4) beinhaltet eine Inkompatibilität mit jQuery ab Version 1.9, da dort die Unterstützung für jQuery.browser eingestellt worden ist. Darauf will das Fancybox-Script aber zugreifen. Das hat zur Folge, dass es auf der Konsole des verwendeten Browsers zu einer Fehlermeldung kommt und dass ggf. sonstiger JavaScript Code auf der Seite …


Beitrag lesen
25.
März
2014

imxTools1 und imxTools2 in einem Portal… erste Schritte sind gegangen

Autor: Bastian Schwarz


Technologie


Im Zuge des Schneebayern-Projektes besteht die Anforderung, dass die imxTools1 (für allgemeine imxTools-Inhalte) sowie die imxTools2 (für den Schneehöhenticker) parallel zueinander laufen müssen. Dazu wurde ein neuer Task in der build.xml angelegt, der eigtl genau das gleiche tut wie der register_integration_imxtools, nur dass er das Ziel in einen imxtools2 Ordner anlegt. Auszug aus der build.properties: …


Beitrag lesen
25.
Nov.
2011

<enki/>

Autor: Benjamin Hofmann


Technologie // Über den Tellerrand


Ich bin neulich über Enki, eine kleine interessante App für iPhone und Android gestolpert, die einem Entwickler zu bestimmten Themen täglich kleine Aufgaben gibt, die es zu lösen gilt. Das Ganze dient dazu in wenigen Minuten täglich etwas zusätzliches Wissen aufzubauen oder dieses zu vertiefen. Die App stellt sich wie ein typischer Fitness-Tracker da und …


Beitrag lesen
07.
Sep.
2016

ReCSS – Reload your CSS

Autor: Benjamin Hofmann


Technologie


Jeder kennt das Problem. Man ändert einen kleinen Style, bspw. ob der Text fett ist oder nicht und dann lädt man die Seite neu, um zu schauen wie es aussieht. Und dann wartet man. Lokal manchmal sogar ziemlich lang und das für die kleinste Anpassung. Es gibt jedoch ein kleines Bookmarklet, um die Style-Entwicklung zu …


Beitrag lesen
22.
August
2012