Ein Karussell bietet eine schnelle Möglichkeit, viele unterschiedliche Inhalte zu präsentieren, wobei man normalerweise einen Kompromiss eingehen muss zwischen der Rotationsgeschwindigkeit und der Möglichkeit, nicht nur die Überschrift, sondern den ganzen Text lesen zu können. Also braucht man Links zur Navigation.
Zur Optimierung fügt man ein <div>-Element für die Navigationslinks hinzu, mit denen man jede der vier Storys direkt aufrufen kann. Außerdem gibt es Vor- und Zurück-Links, mit denen man die Anzeige des Karussells steuern kann.
Hier der HTML-Code für die Navigation, der vor dem schließenden <body>-Tag eingefügt wird.
Damit das Karussell funktioniert und einer Flash-Variante ähnelt, benötigt man noch weitere Javascript-Funktionen:
Alles nichts Besonderes, aber notwendig. Nun muss auch die Funktion rotateDiv geändert werden, damit sie weiß, welche Story gerade angezeigt wird. Hier der entsprechende Code:
Außerdem gibt es einige neue Styles, die dem Stylesheet hinzugefügt werden müssen:
Damit sind alle Funktionen für das einfache Karussell vorhanden. Den vollständigen Code bis zu diesem Stadium kann man sich hier anzeigen lassen.
Die OutSystems Developer School hilft Entwicklern, in 2 Wochen komplexe reaktive Anwendungen mit der Low-Code-Plattform…
Das Jahr 2024 beginnt laut Cloudflare mit einem Paukenschlag. Die automatischen Systeme des Unternehmens wehren…
Laut Kaspersky nehmen Infostealer gerade auch Spieleplattformen ins Visier. Neue Studie untersucht Angriffe zwischen 2021…
Ohne eine kostenlose Alternative, die ohne Zustimmung zur Verarbeitung personenbezogener Daten zu Werbezwecken auskommt, ist…
LabHost gilt als einer der größten Phishing-Dienstleister weltweit. Die Ermittler verhaften 37 Verdächtige, darunter der…
Neuer Datendurchsatz-Rekord an Europas größtem Internetknoten parallel zum Champions-League-Viertelfinale.