JQuery: Slideshow-Plugins mit wechselnden Bildern und Text
Eine Slideshow sieht das Auge des Besuchers einer Webseite fast schon magisch an. Besonders mit einem „Fade in“ und „Fade out“ Effekt bei den Bildern und Texten wird die Aufmerksamkeit des Nutzers auf das interaktive Element Slider, auch besser bekannt als „Slide Show“ oder „Slideshow“, gelenkt. Ein sogenannter Slider mit wechselnden Bildern und Teasertext kann mittels des JQuery-Frameworks (Javascript) umgesetzt werden.
JQuery im Zusammenspiel mit CSS sorgen dafür, dass hier dann keine Wünsche mehr offen gelassen werden. Die Plugins lassen sich in der Regel mit wenig Aufwand an das eigene Layout und Design anpassen. Es existieren bereits zahlreiche fertige Plugins.
In diesem Artikel werde ich die besten Slideshow (Slider) Plugins vorstellen und kurz darauf eingehen. In den Kommentaren können gerne weitere Slideshows genannt werden. Ich werde die Liste weiter ausbauen. Wichtig für mich ist, dass das jeweilige Plugin nicht nur Bilder, sondern auch einen Text anzeigen kann, denn das kann oftmals nicht jedes Plugin.
1.) nivoSlider
Der nivoSlider ist als jQuery Plugin kostenlos unter der MIT Lizenz erhältlich und bei vielen Programmierern bereits bekannt. Hierfür spricht auch die sehr hohe Anzahl an Downloads, die auf der Startseite angezeigt werden. Es gibt es auch ein kostenpflichtiges WordPress-Plugin. Auf der offiziellen Webseite zum Slider stehen 4 Themes zum freien Download bereit. Mir gefällt das Plugin, weil es relativ leicht angepasst und Templates sehr schnell ausgetauscht werden können. Die Einstellungsmöglichkeiten sind meiner Meinung nach ausreichend.
2.) SlidesJS
Ein weiteres einfaches Slideshow-Plugin ist SlideJS. Wie bei den meisten ist auch hier das Markup für den Einbau sehr einfach gehalten. Bilder-Slideshows, aber auch normale Text-Slides sind bei diesem Plugin möglich, oder eben beides zusammen, was für mich das ausschlaggebende Kriterium zur Aufnahme dieses Plugins in die Liste ist. Auf der Webseite des Erstellers Nathan Searles steht der kostenlose Download, Beispiele sowie die Doku bereit.
3.) Flexslider 2
Einfaches Markup, viele Einstellungen, Callback API und noch mehr bietet der Flexslider 2 von WooThemes. Unter anderem ist hier auch die „touch swipe“ Navigation möglich. Auf der von mir verlinkten Homepage ist alles sehr schön auf einer Seite sowie die neuen Features zusammengefasst. Ein Karusell (Carousel) und die Anordnung von Vorschaubildern ähnlich einer Gallery sind bei diesem Plugin möglich. Eine Demo Seite für die Slideshowtypen ist verfügbar.
4.) …
Diese Liste wird ständig aktualisiert und erweitert. Weitere Vorschläge können in den Kommentaren gemacht werden.
Die letzten Kommentare