Boah, Newsticker sind doch so…. 2016


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


Webfonts und der Layout Shift

Autor*in: Axel Güldner


infomax // Technologie // User Experience & Design


„Webfonts sind super“ – erläutert der Webdesigner mittleren Alters. „Bevor wir Webfonts hatten, waren wir mal sowas von eingeschränkt – Arial, Verdana, Georgia – Bums aus die Maus, sehr viel mehr hatten wir nicht.“ führt er weiter aus und klingt dabei wie ein Großvater der vom Krieg erzählt.„Webfonts sind furchtbar“ – erfährt man hingegen vom …


Beitrag lesen
27
OKT
21

iOS Probleme mit transition

Autor*in: Florian Müller


Technologie // User Experience & Design


Heute ist mir bei einem Projekt ein Problem mit iOS begegnet. Es gibt eine Galerie, bei welcher die Elemente von oben „hereinfliegen“. Auf dem iPad und dem iPhone war dieser Effekt kaum beziehungsweise gar nicht vorhanden, sondern das Bild war einfach *plopp* da. Problem hierbei ist, dass transitions bei iOS ohne Hardware Beschleunigung gerendert werden. …


Beitrag lesen
28
SEP
16

Facebook-App als Seitenreiter zu einer Fanpage hinzufügen

Autor*in: Stefan Oswald


Technologie


Um einer Facebook-Seite (Fanpage) eine eigene Seitenreiter-App hinzuzufügen, ist ein kleiner Workaround notwendig. Hinweis: Die Voraussetzungen, um überhaupt eine Seitenreiter-App erstellen zu können, ist ein Developer Account bei Facebook. Nach dem Erstellen der Seitenreiter-Anwendung kopiert man einfach die App-ID, fügt diese in den unten stehenden Link ein, ruft die URL im Browser auf und wählt …


Beitrag lesen
22
JAN
14

Builder Pattern Eclipse Plugin

Autor*in:


Technologie


J. Bloch schildert in „Effective Java“ die Vorzüge des Builder Patterns, insbesondere bei Konstruktoren mit mehr als 4 Parametern: verbesserte Lesbarkeit, vor allem bei einer Vielzahl an optionalen Parametern konsistente, in sich abgeschlossene Erzeugung von unveränderlichen Objekten (im Vergleich zur Erzeugung mittels JavaBean Settern) Trotzdem ist das Schreiben des Builder-Codes ein wenig zeitaufwändig. Mittels dieses …


Beitrag lesen
05
JUL
12