離子幻燈片循環後的空白區域

Question

我正在構建一個小規模的移動應用程序，並已使用ionSlides（基於Swiper小部件）實施滑動按鈕欄。這個想法是在這個欄上有一些用戶可以循環/循環的項目。

我當前實現的問題是第一個循環結束後/下一個循環之前有一些空白空間。在DOM中，沒有生成「空白」元素。有一個swiper-wrapper類的div，它的變換樣式是在用戶滑動時更新的 - 它在列表末尾接近-500px，滑過白色區域後再次點擊回0。

是否有修復程序，或者是否有任何屬性可以嘗試應用於選項，或者有其他人之前看過此問題？

一些代碼：

index.html

<ion-slides options="options" slider="data.slider"> 
    <ion-slide-page ng-repeat="slide in slides" class="circle white-bg"> 
     <h2>{{slide}}</h2> 
    </ion-slide-page> 
</ion-slides> 

---

app.js

$scope.slides = ['1', '2', '3', '4', '5', '6']; 

$scope.options = { 
    loop: true, 
    effect: 'slide', 

    freeMode: true, 
    freeModeSticky: false, 

    width: 55, 
    spaceBetween: 25 
} 

一些照片：

滑塊
1. 走向幻燈片列表的末尾的
2. 開始
3. 的實施例「填料」白空間 一旦滑動＃1已被滑出的視圖中，框恢復到正常狀態，並且類似於圖片＃1的相同行爲。

Answer 1

爲別人誰可能有這個問題：

我刪除從width屬性從$ scope.options，並用slidesPerView代替。沒有任何空白的循環！

$scope.options = { 
    loop: true, 
    effect: 'slide', 

    freeMode: true, 
    freeModeSticky: false, 

    slidesPerView: 6, 
    spaceBetween: 25 
}