
設計出了一個這樣的swiper,兩側的大小明顯小于中間的且只顯露了一半,這樣的樣式我們怎么做呢,眾所周知,swiper有一個異形的Slide,其實就是未選擇的swiper用transform: scale()縮小,而選中的則變為正常,我們可以直接借鑒過來。

那么我們怎么規定顯示的的圖片呢?

Swiper中有兩個屬性,
1.分別為centeredSlides使swiper選中的在中間顯示,
2.slidesPerView顯示幾個,這個數據可以設定為小數,如上意味著顯示1.25個。
在開啟循環的同時,由于swiper顯示是在中間,那么左右兩邊的swiper會均分剩余的0.25,那么我們選中的swiper就會出現“左右護法”了。
以下就是實現的效果,大家不要忘了把左右兩邊間距調整為0,因為我們的transform已經把左右兩側的大小調整為原本的0.8倍了。

上一篇: Less——混合(Mixin)(下)
