Beim Versuch, ein Bootstrap 3-Karussell zu finden, wird das angezeigte Hauptbild auf die natürliche Breite der Bilder beschränkt und Teile des vorherigen und nächsten Bildes angezeigt, um den Rest des Bildschirms auf 100% Breite unter dem nächsten / vorherigen Bild zu füllen Pfeile. Nicht ganz sicher, wie Vorschaubilder der nächsten und vorherigen Bilder angezeigt werden.
Verwenden des Standard-Bootstrap-Karussell-Codes:
%Vor%
Der folgende Code funktioniert, wenn alle Bilder die gleiche Breite haben, sonst können Sie dasselbe machen, aber dann benötigen Sie eine komplexere Berechnung pro Folie.
Geben Sie zuerst jedes div.item drei Bild (vorher, aktuell, nächstes):
Verwenden Sie dann den folgenden Less-Code:
%Vor% In der oben angegebenen @image-width auf die Breite Ihrer Schieberegler Bilder. Der vorangehende Less-Code wird in den folgenden CSS-Code kompiliert:
Demo:
Um dies mit dem Bootstrap zu tun, sollte .carousel-inner größer als .carousel sein. Außerdem sollte es zentriert sein. Sie können folgende CSS-Codes verwenden, um diese Änderung zu implementieren:
Wenn Ihr Bootstrap 3.3.0 und höher ist, dann
%Vor%Für Bootstrap unter 3.3.0
%Vor%Tags und Links twitter-bootstrap-3 carousel