2016-07-16 14 views
2

Airbnb SliderSwiper Slides - zeigt Ende/Anfang der vorherigen/nächsten Folien wie Airbnb Slider?

Oben ist der Schieberegler von Airbnb. Gibt es eine Möglichkeit, einen ähnlichen Effekt mit Swiper zu bekommen?

  1. Für die erste Folie gibt es links eine Leerstelle und starten Sie der nächsten Folie.
  2. Für die mittlere Folie gibt es Anfang und Ende der vorherigen und nächste Folien.
  3. Für die letzte Folie befindet sich rechts und am Ende der vorherigen Folie links ein Leerzeichen.
+0

Es gibt eine jquery Lösung bei dieser Frage. [create image slider, der einen Teil des vorherigen und nächsten Bildes zeigt] (http://stackoverflow.com/questions/9693492/create-image-slider-that-shows-part-of-previous-and-next-image?) Ermöglicht das Swiper-Plugin dies einfacher? Wenn nicht, wäre es dann möglich, dasselbe mit Angular 2 statt Jquery zu machen? – Dee

+0

Haben Sie eine Lib gefunden, um das Karussell so zu machen? Genau das suche ich. –

Antwort

0

Stellen Sie einfach die slidesPerView Option Dezimalstellen, zB:

var swiper = new Swiper('.swiper-container', { 
    ... 
    // this shows a bit of the previous/next slides 
    slidesPerView: 1.1, 
    centeredSlides: true, 
    spaceBetween: 10, 
    ... 
}); 

Solange Sie die Diashow in einer Schleife nicht gesetzt, dann der erste und der letzte Schieber anstelle eines Teils zusätzlichen Platz haben von eine andere Folie.

Verwandte Themen