Im Internet finden Sie viele tolle Plugins zum Erstellen von jQuery-Karussells und -Slidern. Sie ermöglichen Ihnen, dynamisches Scrollen mit zusätzlichen Effekten zu implementieren.
Dies ist einer der beliebtesten Trends im Webdesign der letzten Jahre. Darüber hinaus kann die Verwendung vorgefertigter Bibliotheken und jQuery-Plugins erheblich Zeit sparen. Sie müssen lediglich einen Link zu den JavaScript- und CSS-Dateien bereitstellen und dann den Effekt auf die gewünschten HTML-Elemente anwenden.
Sie können auch Ihre eigenen Einstellungen und CSS-Stile festlegen. Der heutige Artikel soll Ihnen responsive jQuery-Plugins zum Erstellen von Karussells und Slidern vorstellen.
Distractful – jQuery-Plugin zum Erstellen eines berührungsempfindlichen Vollbild-Inhaltsschiebereglers
Reaktionsfreudiger Vollbild-Karussell-Schieberegler für jQuery-Inhalte mit Touchscreen-Unterstützung. Das Plugin wird unter der GNU GENERAL PUBLIC LICENSE v3 vertrieben:
Neoslide: ein einfaches und erweiterbares jQuery-Karussell-Plugin
Ein einfaches und erweiterbares jQuery-Plugin, mit dem Sie auf jeder Webseite einen vollständig anpassbaren Slider verwenden können:
Hslider: Reaktionsfähiges Bildergalerie-Plugin in voller Breite
Ein weiteres Plugin zum Anzeigen von Bildern mithilfe eines responsiven jQuery-Karussells mit Steuerelementen und benutzerdefinierter Verzögerungsdauer:
Carousel 3D: jQuery-Karussell-Plugin mit 3D-Rotationseffekten
Schlanker Slider: Responsives jQuery-Karussell im Vollbildmodus
Miniaturisiertes und attraktives jQuery-Karussell zur Präsentation von Inhalten und Bildern mit verschiedenen Navigationsarten (SVG-Pfeile mit Bildminiaturansichten, Paginierungselementen oder Tabulatoren):
PaW-Karussell: Responsives Karussell, unterstützt von jQuery
PaW Carousel (v2) ist ein Miniatur-Plugin zum Erstellen reaktionsfähiger, einfacher jQuery-Karussells mit Miniaturansichten von Bildern:
Carousel Sharer: jQuery-Karussell zum erneuten Posten in sozialen Netzwerken
Carousel Sharer ist ein jQuery-Plugin, mit dem Sie mehrere Produkte hintereinander anzeigen und Besuchern ermöglichen können, Ihre Produkte auf Facebook, Twitter, Google+ und Pinterest zu teilen:
Simply Carousel: ein minimalistisches, responsives Bildkarussell
Simply Carousel ist ein kleines und schnelles jQuery-Plugin, mit dem Sie flexible, reaktionsfähige Bild-Slider und Karussells erstellen können:
Folien: Responsives jQuery-Karussell und Diashow mit Touch-Unterstützung
Slides ist ein Miniatur-jQuery-Plugin zum Erstellen responsiver Karussells für eine jQuery-Website mit Miniaturansichten, Pfeilnavigation und der Möglichkeit, benutzerdefinierte Steuerelemente zu verwenden. Unterstützung für Touchscreens wurde implementiert:
jQuery-Inhaltskarussell
Ein einfaches responsives jQuery-Karussell mit Autoplay-Funktionen, Steuerelementen und sogar Rückruffunktionen:
Slick: Reaktionsfähiges und flexibles jQuery-Karussell
Slick ist ein „frisches“ Plugin zum Erstellen benutzerdefinierter, reaktionsfähiger und für Mobilgeräte optimierter jQuery-Karussells und Slider, die mit allen HTML-Elementen funktionieren können:
bxSlider: jQuery-HTML-Inhaltsschieberegler
bxSlider ist einer der besten derzeit verfügbaren jQuery-Inhalts-Slider. Dieses Plugin eignet sich perfekt zum Organisieren von Diashows:
CarouFredSel: ein flexibles und leistungsstarkes jQuery-Karussell-Plugin
jQuery.carouFredSel ist ein Plugin, das jedes HTML-Element in ein Inhaltskarussell verwandelt. Sie können ein oder mehrere Elemente gleichzeitig horizontal und vertikal scrollen. Sie können auch die automatische Wiedergabe aktivieren und das Scrollen endlos machen:
Radfahrendes Inhaltskarussell mit jQuery
Ein Karussell, in dem mit jedem Klick ein neuer Inhaltsblock angezeigt wird. Durch Klicken auf das Kreuz wird der aktive Block geschlossen und wir kehren zur Ausgangsposition der Miniaturansichten zurück:
Cloud Carousel: 3D-Karussell in Javascript
Mit diesem Karussell können Sie eine realistische Perspektive erstellen. Viele jQuery-3D-Karussells wenden einen perspektivischen Effekt nur auf die Größe des Bildes an, nicht auf seine Position, was zu einem Missverhältnis der Elemente auf der Seite führt:
Elastislide: Responsives Karussell mit jQuery
Elastislide ist ein responsives jQuery-Karussell, das sich an jede Bildschirmgröße anpasst. Wenn Sie ein Karussell in einen Behälter mit flexibler Breite einsetzen, wird das Karussell selbst „gummiartig“:
jCarousel Lite
Mit diesem Plugin können Sie Bilder oder HTML-Elemente als Slider anzeigen. Es wiegt nur 2 KB, ermöglicht Ihnen aber gleichzeitig die Verwendung Ihrer eigenen Einstellungen:
3D-Karussell
Erstellen Sie ein 3D-jQuery-Karussell aus Bildern mit Schatteneffekten und Animationen, die auf die Cursorposition reagieren:
JQuery-Karussell-Plugin
Mit den Einstellungen dieses Plugins können Sie bestimmen, wie viele Elemente im Karussell angezeigt werden, woraufhin das Plugin es auf die gewünschte Breite anpasst:
Rotierender Bildschieberegler mit jQuery
Ein asymmetrischer Bildschieberegler mit einer kleinen Ergänzung: Wenn Sie durch die Bilder scrollen, drehen sie sich leicht. Durch die leichte Verschiebung der Elemente erhält der Schieber eine ungewöhnliche Form:
jQuery-Funktionskarussell
Dieses Plugin dient dazu, empfohlene Artikel auf der Startseite anzuzeigen, kann aber auch für beliebige andere Inhalte verwendet werden. Es ermöglicht die gleichzeitige Anzeige von bis zu drei Bildern, während der Rest des jQuery-Inhaltskarussells ausgeblendet ist:
jQuery Unendliches Karussell
Es handelt sich um ein jQuery-Plugin, mit dem Sie eine unbegrenzte Anzahl von Bildern und Videos in einem Karussell anzeigen können. Im Gegensatz zu anderen Karussells zeigt Infinite Carousel Elemente in einer Endlosschleife an, ohne dass eine Navigation erforderlich ist:
jQuery Liquid Carousel-Plugin
Liquid Carousel ist ein Plugin zur Erstellung flüssiger Designs. Jedes Mal, wenn sich die Größe des responsiven jQuery-Karussellcontainers ändert, passt sich die Anzahl der angezeigten Elemente an die neue Breite an:
Jquery MS Karussell
Die Zeit steht nicht still und mit ihr auch der Fortschritt. Davon war auch das Internet betroffen. Man sieht bereits, wie sich das Erscheinungsbild von Websites verändert, besonders beliebt ist adaptives Design. Und in diesem Zusammenhang sind etliche neue adaptive JQuery-Slider, Galerien, Karussells oder ähnliche Plugins erschienen.
1. Responsiver Schieberegler für horizontale Beiträge
Adaptives horizontales Karussell mit ausführlicher Installationsanleitung. Es ist in einem einfachen Stil gehalten, aber Sie können es individuell gestalten.
2. Schieberegler auf Glide.js
Dieser Slider ist für jede Website geeignet. Es verwendet Open-Source-Glide.js. Die Farben der Schieberegler können einfach geändert werden.
3. Diashow mit geneigtem Inhalt
Responsiver Inhaltsschieberegler. Das Highlight dieses Sliders ist der 3D-Effekt der Bilder sowie verschiedene Animationen mit zufälliger Erscheinung.
4. Slider mit HTML5-Canvas
Ein sehr schöner und beeindruckender Slider mit interaktiven Partikeln. Es wurde mit HTML5-Canvas erstellt,
5. Bild-Morphing-Schieberegler
Schieberegler mit Morphing-Effekt (sanfte Transformation von einem Objekt zum anderen). In diesem Beispiel eignet sich der Slider gut für das Portfolio eines Webentwicklers oder Webstudios in Form eines Portfolios.
6. Rundschieber
Schieberegler in Form eines Kreises mit dem Effekt, das Bild umzudrehen.
7. Schieberegler mit unscharfem Hintergrund
Adaptiver Schieberegler mit Umschalt- und Hintergrundunschärfe.
8. Responsiver Fashion-Slider
Einfacher, leichter und reaktionsfähiger Website-Slider.
9. Slicebox – jQuery 3D-Bild-Slider (AKTUALISIERT)
Aktualisierte Version des Slicebox-Sliders mit Korrekturen und neuen Funktionen.
10.Kostenloses animiertes Responsive Image Grid
JQuery-Plugin zum Erstellen eines flexiblen Bildrasters, das Aufnahmen mit unterschiedlichen Animationen und Timings wechselt. Dies kann als Hintergrund oder dekoratives Element auf einer Website gut aussehen, da wir gezielt neue Bilder und deren Übergänge einblenden können. Das Plugin gibt es in mehreren Versionen.
11.Flex-Schieberegler
Ein universelles kostenloses Plugin für Ihre Website. Dieses Plugin gibt es in mehreren Slider- und Karussell-Optionen.
12. Fotorahmen
Fotorama ist ein universelles Plugin. Es gibt viele Einstellungen, alles funktioniert schnell und einfach und Sie können Folien im Vollbildmodus betrachten. Der Slider kann sowohl in fester Größe als auch adaptiv, mit oder ohne Miniaturansichten, mit oder ohne kreisförmigem Scrollen und vielem mehr verwendet werden.
P.S. Ich habe den Slider mehrmals installiert und finde, dass er einer der besten ist
13. Kostenlose und adaptive 3D-Slider-Galerie mit Miniaturansichten.
Experimentelle Slider-Galerie 3DPanelLayout mit Raster und interessanten Animationseffekten.
14. Slider auf CSS3
Der adaptive Schieberegler wird mit CSS3 erstellt und sorgt für eine reibungslose Darstellung des Inhalts und leichte Animationen.
15. WOW-Slider
WOW Slider ist ein Bild-Slider mit erstaunlichen visuellen Effekten.
17. Elastisch
Elastischer Slider mit voller Reaktionsfähigkeit und Slide-Thumbnails.
18. Schlitz
Dies ist ein responsiver Vollbild-Slider mit CSS3-Animation. Der Schieber wird in zwei Versionen hergestellt. Die Animation ist recht ungewöhnlich und schön gemacht.
19. Adaptive Fotogalerie plus
Ein einfacher kostenloser Galerie-Slider mit Bildladen.
20. Responsiver Slider für WordPress
Adaptiver kostenloser Slider für WP.
21. Parallax-Inhaltsschieberegler
Slider mit Parallaxeneffekt und Steuerung jedes Elements mit CSS3.
22. Slider mit Musiklink
Slider mit JPlayer-Open-Source-Code. Dieser Slider ähnelt einer Präsentation mit Musik.
23. Slider mit jmpress.js
Der responsive Slider basiert auf jmpress.js und ermöglicht Ihnen daher, Ihren Folien einige interessante 3D-Effekte hinzuzufügen.
24. Schnelle Hover-Diashow
Diashow mit schnellem Diawechsel. Folien wechseln beim Schweben.
25. Bildakkordeon mit CSS3
Bildakkordeon mit CSS3.
26. Ein Touch-optimiertes Galerie-Plugin
Dies ist eine responsive Galerie, die für Touch-Geräte optimiert ist.
27. 3D-Galerie
3D-Wandgalerie – erstellt für den Safari-Browser, wo der 3D-Effekt sichtbar ist. Wenn Sie es in einem anderen Browser betrachten, ist die Funktionalität in Ordnung, aber der 3D-Effekt ist nicht sichtbar.
28. Schieberegler mit Paginierung
Responsiver Schieberegler mit Paginierung mithilfe des JQuery-UI-Schiebereglers. Die Idee ist, ein einfaches Navigationskonzept zu verwenden. Es ist möglich, alle Bilder zurückzuspulen oder von Bild zu Bild zu wechseln.
29.Bildmontage mit jQuery
Ordnen Sie Bilder automatisch je nach Bildschirmbreite an. Eine sehr nützliche Sache bei der Entwicklung einer Portfolio-Website.
30. 3D-Galerie
Ein einfacher kreisförmiger 3D-Schieberegler mit CSS3 und jQuery.
31. Vollbildmodus mit 3D-Effekt mit CSS3 und jQuery
Ein Schieberegler mit der Möglichkeit, Vollbildbilder mit einem schönen Übergang anzuzeigen.
Sie versuchen, den Benutzern so viel wie möglich zu zeigen, möchten diese Informationen jedoch auf organisierte und saubere Weise vermitteln. Deshalb haben wir für Sie einen gebrauchsfertigen jQuery-Slider mit einigen integrierten Optionen wie Video-/Bildhintergründen und verschiedenen Textausrichtungen erstellt. Um die Benutzerinteraktion zu verbessern, haben wir die „Navigationspfeile“ durch Schaltflächen ersetzt. Der Unterschied besteht darin: Die Schaltflächen haben einen Titel, einen Hinweis darauf, welche Inhalte zu erwarten sind. Die Pfeile sagen den Benutzern einfach: „Sie können die Folie wechseln.“
Eine Struktur schaffenDer HTML-Code ist in zwei Hauptelemente strukturiert: eine ungeordnete Liste, ul.cd-hero-slider, die die Folien enthält, und div.cd-slider-nav, die die Slider-Navigation und den span.cd-Marker enthält (wird zum Erstellen des ausgewählten Elementmarkers im verwendet). Navigation).
- Einführung
- Technik 1
Einen Stil hinzufügen
Der Aufbau des Sliders ist recht einfach: Alle Slides werden nach rechts verschoben, außerhalb des Viewports translatorX (100 %); Die ausgewählte Klasse wird der sichtbaren Folie hinzugefügt, um sie zurück in das Ansichtsfenster translatorX (0) zu verschieben, und die Klasse .move-left wird verwendet, um die Folie nach links translatorX (-100%) zu verschieben.
Um eine reibungslose Animation zu erreichen, haben wir CSS3-Übergänge verwendet, die auf die Elemente .selected und .is-moving angewendet wurden: Wenn eine neue Folie ausgewählt wird, wird die Klasse .is-moving der Folie zugewiesen, die sich außerhalb des Ansichtsfensters bewegt, während die ausgewählte Klasse dies tut der ausgewählten Folie zugewiesen.
Cd-hero-slider li ( Position: absolut; oben: 0; links: 0; Breite: 100 %; Höhe: 100 %; transform: TranslateX(100 %); ) .cd-hero-slider li.selected ( /* Dies ist die sichtbare Folie */ Position: relative; Transformation: TranslateX(0); ) .cd-hero-slider li.move-left ( /* Folie links ausgeblendet */ Transformation: TranslateX(-100%); ) .cd-hero-slider li.is-moving, .cd-hero-slider li.selected ( /* die is-moving-Klasse wird der Folie zugewiesen, die sich außerhalb des Ansichtsfensters bewegt */ Transition: transform 0.5s; )
Informationen zur Animation einzelner Folien: Auf größeren Geräten (Ansichtsfensterbreiten größer als 768 Pixel) haben wir beschlossen, den Einstiegseffekt aufzupeppen, indem wir die einzelnen Folienelemente.cd-half-width und .cd-full-width animieren, indem wir ihre Deckkraft und Transformationseigenschaften ändern .
Die Klassen .from-left und .from-right werden verwendet, um zu bestimmen, ob die ausgewählte Folie von links oder von rechts in das Ansichtsfenster eintritt, um je nach Eintrittsrichtung eine andere Animation auszulösen. Damit dieser Effekt korrekt funktioniert, haben wir für jedes animierte Element einen anderen Animationsverzögerungswert verwendet.
Für elements.cd-half-width beispielsweise:
Nur @media-Bildschirm und (Mindestbreite: 768 Pixel) (
.cd-hero-slider .cd-half-width (
Deckkraft: 0;
transform: TranslateX(40px);
}
.cd-hero-slider .move-left .cd-half-width (
transform: TranslateX(-40px);
}
.cd-hero-slider .selected .cd-half-width (
/* das ist die sichtbare Folie */
Deckkraft: 1;
transform: TranslateX(0);
}
.cd-hero-slider .is-moving .cd-half-width (
/* Dies ist die Folie, die sich außerhalb des Ansichtsfensters bewegt
Warten Sie auf das Ende des Übergangs
Übergang: Deckkraft 0s 0,5s, Transformation 0s 0,5s;
}
.cd-hero-slider li.selected.from-left .cd-half-width:nth-of-type(2),
.cd-hero-slider li.selected.from-right .cd-half-width:first-of-type (
Übergang: Deckkraft 0,4 s 0,2 s, Transformation 0,5 s 0,2 s;
}
.cd-hero-slider li.selected.from-left .cd-half-width:first-of-type,
.cd-hero-slider li.selected.from-right .cd-half-width:nth-of-type(2) (
/* Dies ist die ausgewählte Folie – andere Animation, wenn sie von links oder rechts kommt */
Übergang: Deckkraft 0,4 s 0,4 s, Transformation 0,5 s 0,4 s;
}
} Handhabung des Events
Das als Hintergrund für eine der Folien verwendete Video wird nicht direkt in den HTML-Code eingefügt, sondern nur geladen, wenn das Gerät größer als 768 Pixel breit ist; Auf diese Weise wird das Video nicht auf mobile Geräte heruntergeladen. Die Videodaten der ausgewählten Folie werden zum Extrahieren des Videos verwendet. Das Gleiche können Sie auch für Elemente tun in der Datei „container.cd-img“ (die auf Mobilgeräten verborgen ist).
Darüber hinaus haben wir jQuery verwendet, um die Diashow-Funktionalität zu implementieren: Wenn der Benutzer auf eine der Registerkartenliste items.cd-slider-nav klickt, erkennen wir die Position des ausgewählten Elements (mithilfe der Funktion index()) und aktualisieren den Schieberegler (mit das nextSlide() oder prevSlide() entsprechend dieser Position) und die span.cd-Marker-Position.
$(".cd-slider-nav li").on("click", function(event)( event.preventDefault(); var selectedItem = $(this); if(!selectedItem.hasClass("selected")) ( // wenn es noch nicht ausgewählt ist var selectedPosition = selectedItem.index(), activePosition = $(".cd-hero-slider .selected").index(); if(activePosition
Notiz!Wenn Sie den Schieberegler automatisch animieren möchten, fügen Sie die Klasse .autoplay zum Element ul.cd-hero-slider hinzu.
SliderPro ist ein responsiver jQuery-Slider mit Unterstützung für Miniaturansichten und andere Einstellungen, einschließlich einer eigenen API.
- Der Schieberegler passt sich standardmäßig der Bildschirmgröße an. Es werden nicht nur Bilder skaliert, sondern auch Ebenen mit Ihren zusätzlichen Inhalten.
- Unterstützung für Touch-Swipe-Ereignisse für Touchscreens. Verwenden von Haltepunkten – ein Analogon zu CSS-Medienabfragen, um Schiebereglereinstellungen auf verschiedenen Bildschirmgrößen zu ändern.
- Reibungslose Animation mit CSS3-Übergängen, Ebenenanimation, Fade-Effekt für den Folienwechsel.
- Der Schieberegler kann sich über die gesamte Breite der Seite oder den gesamten Bildschirm erstrecken oder sich innerhalb eines Containers befinden.
- Diahöhe automatisch ändern. Die Ausrichtung der Vorschauen kann entweder vertikal oder horizontal sein.
- Für Bilder werden Lazy Loading, Retina und die Möglichkeit zum Laden verschiedener Bilder für bestimmte Bildschirmgrößen unterstützt.
- Videounterstützung, Lightbox-Integration, Navigation mit Pfeilen, Punkten, Tastatur, Miniaturansichten und vieles mehr.
Fügen Sie die Stildatei ein:
HTML
Beispiel-Markup zum Einfügen eines Sliders:
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit ametconsectetur adipisicing elit
JSWir verbinden die notwendigen Skripte:
Wir initialisieren das Plugin:
jQuery(document).ready(function($) ( $("#my-slider").sliderPro(); ));
Weitere Details zum Slider und seiner Verwendung finden Sie auf Github. Link unten.
Derzeit ist ein Schieberegler – Karussell – eine Funktionalität, die auf einer Unternehmenswebsite, einer Portfolio-Website oder einer anderen Ressource einfach erforderlich ist. Zusammen mit Vollbild-Bildschiebereglern passen horizontale Karussell-Schieberegler gut in jedes Webdesign.
Manchmal sollte der Slider ein Drittel der Site-Seite einnehmen. Hier kommt der Karussell-Slider mit Übergangseffekten und responsiven Layouts zum Einsatz. E-Commerce-Websites verwenden einen Karussell-Schieberegler, um mehrere Fotos in einzelnen Beiträgen oder Seiten anzuzeigen. Der Slider-Code kann frei verwendet und entsprechend Ihren Bedürfnissen geändert werden.
Durch den Einsatz von JQuery in Verbindung mit HTML5 und CSS3 können Sie Ihre Seiten interessanter gestalten, ihnen einzigartige Effekte verleihen und die Aufmerksamkeit der Besucher auf einen bestimmten Bereich der Website lenken.
Slick – modernes Karussell-Slider-PluginSlick ist ein frei verfügbares JQuery-Plugin, dessen Entwickler behaupten, dass ihre Lösung alle Ihre Slider-Anforderungen erfüllt. Adaptiver Schieberegler – das Karussell kann für Mobilgeräte im „Kachelmodus“ und für die Desktop-Version im „Drag-and-Drop“-Modus verwendet werden.
Enthält einen „Fade“-Übergangseffekt, eine interessante „Center-Modus“-Funktion und verzögertes Laden von Bildern mit automatischem Scrollen. Zu den aktualisierten Funktionen gehören das Hinzufügen von Folien und ein Folienfilter. Alles, um sicherzustellen, dass Sie das Plugin entsprechend Ihren Anforderungen konfigurieren.
Demomodus | Herunterladen
Owl Carousel 2.0 – jQuery – Plugin zur Verwendung auf Touch-GerätenDieses Plugin verfügt über einen großen Funktionsumfang, der sowohl für Anfänger als auch für erfahrene Entwickler geeignet ist. Dies ist eine aktualisierte Version des Karussell-Schiebereglers. Sein Vorgänger trug den gleichen Namen.
Der Slider verfügt über einige integrierte Plugins, um die Gesamtfunktionalität zu verbessern. Animation, Videowiedergabe, Slider-Autoplay, Lazy Loading, automatische Höhenanpassung – das sind die Hauptfunktionen von Owl Carousel 2.0.
Für eine komfortablere Nutzung des Plugins auf Mobilgeräten ist Drag-and-Drop-Unterstützung enthalten.
Das Plugin eignet sich perfekt für die Darstellung großer Bilder auch auf kleinen Bildschirmen mobiler Geräte.
Beispiele | Herunterladen
jQuery-Plugin Silver TrackEin relativ kleines, aber funktionsreiches JQuery-Plugin, mit dem Sie einen Schieberegler auf einer Seite platzieren können – ein Karussell, das einen kleinen Kern hat und nicht viele Site-Ressourcen verbraucht. Mit dem Plugin können vertikale und horizontale Schieberegler mit Animation angezeigt und Bildersätze aus der Galerie erstellt werden.
Beispiele | Herunterladen
AnoSlide – Ultrakompakter, reaktionsfähiger jQuery-SliderUltrakompakter jQuery-Slider – Karussell, dessen Funktionalität viel größer ist als die eines normalen Sliders. Dazu gehören die Einzelbildvorschau, die Karussellanzeige mehrerer Bilder und die titelbasierte Schieberegleranzeige.
Beispiele | Herunterladen
Eulenkarussell – Jquery-Schieberegler – KarussellOwl Carousel ist ein Slider, der Touchscreens und Drag-and-Drop-Technologie unterstützt und einfach in HTML-Code integriert werden kann. Das Plugin ist einer der besten Slider, mit denen Sie wunderschöne Karussells ohne speziell vorbereitetes Markup erstellen können.
Beispiele | Herunterladen
3D-Galerie - KarussellVerwendet 3D-Übergänge basierend auf CSS-Stilen und ein wenig Javascript-Code.
Beispiele | Herunterladen
3D-Karussell mit TweenMax.js und jQueryPrächtiges 3D-Karussell. Es sieht so aus, als wäre dies noch eine Beta-Version, da ich gerade ein paar Probleme damit entdeckt habe. Wenn Sie daran interessiert sind, Ihre eigenen Slider zu testen und zu erstellen, wird dieses Karussell eine große Hilfe sein.
Beispiele | Herunterladen
Karussell mit BootstrapResponsiver Slider – Karussell mit Bootstrap-Technologie nur für Ihre neue Website.
Beispiele | Herunterladen
Moving Box-Karussell-Schieberegler basierend auf dem Bootstrap-FrameworkAm beliebtesten auf Portfolio- und Unternehmenswebsites. Diese Art von Slider – Karussell – ist häufig auf Websites jeglicher Art zu finden.
Beispiele | Herunterladen
Kleiner KreisschieberDieser winzige Schieberegler kann auf Geräten mit jeder Bildschirmauflösung verwendet werden. Der Schieberegler kann sowohl im Kreis- als auch im Karussellmodus arbeiten. Tiny Circle wird als Alternative zu anderen Schiebereglern dieser Art vorgestellt. Es gibt integrierte Unterstützung für IOS- und Android-Betriebssysteme.
Im Kreismodus sieht der Schieberegler recht interessant aus. Hervorragende Unterstützung für die Drag-and-Drop-Methode und ein automatisches Scroll-System für Folien.
Beispiele | Herunterladen
Däumelinchen-InhaltsschiebereglerEin leistungsstarker, anpassungsfähiger Karussell-Schieberegler ist perfekt für eine moderne Website. Funktioniert auf jedem Gerät einwandfrei. Verfügt über horizontale und vertikale Modi. Seine Größe ist auf nur 1 KB minimiert. Das ultrakompakte Plugin verfügt außerdem über hervorragende weiche Übergänge.
Beispiele | Herunterladen
Wow – Slider – KarussellEnthält mehr als 50 Effekte, mit denen Sie einen originellen Slider für Ihre Website erstellen können.
Beispiele | Herunterladen
Responsiver jQuery-Inhaltsschieberegler bxSliderÄndern Sie die Größe Ihres Browserfensters, um zu sehen, wie sich der Schieberegler anpasst. Bxslider verfügt über mehr als 50 Anpassungsoptionen und präsentiert seine Funktionen mit verschiedenen Übergangseffekten.
Beispiele | Herunterladen
jKarusselljCarousel ist ein jQuery-Plugin, das Ihnen bei der Organisation der Anzeige Ihrer Bilder hilft. Aus der im Beispiel gezeigten Basis können Sie ganz einfach benutzerdefinierte Bildkarussells erstellen. Der Schieberegler ist adaptiv und für die Arbeit auf mobilen Plattformen optimiert.
Beispiele | Herunterladen
Scrollbox – jQuery-PluginScrollbox ist ein kompaktes Plugin zum Erstellen eines Sliders – eines Karussells oder eines Text-Crawls. Zu den Hauptfunktionen gehören vertikale und horizontale Scrolleffekte mit Pause beim Bewegen der Maus.
Beispiele | Herunterladen
dbpasCarouselEin einfacher Karussell-Slider. Wenn Sie ein schnelles Plugin benötigen, ist dieses zu 100 % geeignet. Verfügt nur über die grundlegenden Funktionen, die für die Funktion des Sliders erforderlich sind.
Beispiele | Herunterladen
Flexisel: Responsives JQuery-Slider-Plugin – KarussellDie Entwickler von Flexisel ließen sich vom Old-School-Plugin jCarousel inspirieren und erstellten eine Kopie davon, um die korrekte Bedienung des Sliders auf Mobil- und Tablet-Geräten zu gewährleisten.
Das responsive Layout von Flexisel unterscheidet sich bei der Ausführung auf Mobilgeräten von einem Layout in Browserfenstergröße. Flexisel ist perfekt für die Arbeit auf Bildschirmen mit niedriger und hoher Auflösung geeignet.
Beispiele | Herunterladen
Elastislide – adaptiver Slider – KarussellElastislide passt sich perfekt der Größe des Bildschirms Ihres Geräts an. Sie können die Mindestanzahl der Bilder festlegen, die bei einer bestimmten Auflösung angezeigt werden sollen. Funktioniert gut als Karussell-Slider mit Bildergalerien und verwendet einen festen Wrapper zusammen mit einem vertikalen Scroll-Effekt.
Beispiel | Herunterladen
FlexSlider 2Freeware-Slider von Woothemes. Er gilt zu Recht als einer der besten adaptiven Schieberegler. Das Plugin enthält mehrere Vorlagen und ist sowohl für Anfänger als auch für Experten nützlich.
Beispiel | Herunterladen
Erstaunliches KarussellErstaunliches Karussell – reaktionsfähiger Bild-Slider mit jQuery. Unterstützt viele Content-Management-Systeme wie WordPress, Drupal und Joomla. Unterstützt auch Android- und IOS- sowie Desktop-Betriebssysteme ohne Kompatibilitätsprobleme. Integrierte erstaunliche Karussellvorlagen ermöglichen Ihnen die Verwendung des Schiebereglers im vertikalen, horizontalen und kreisförmigen Modus.
Beispiele | Herunterladen
