swiperスライドを常にスクロールしてください。

Question

swiper.jsを使用しています。 新しい/アクティブなスライドを常に上にスクロールさせたいので、新しいスライドがビューポートに入ると、そのコンテンツを上にスクロールする必要があります。

は、私はここでバイオリンを持っている：https://jsfiddle.net/p406sfe4/8/

Iしかし、このスクリプトは私が必要なものを達成かもしれないが、動作するようには思えないこと：

swiper.on('slideChangeEnd', function(s) { 
    s.slides.each(function() { 
    if ($(this).index() !== s.activeIndex) $(this)[0].scrollTop = 0 
    }); 
}); 

感謝を！

Answer 1

オーバーフローの原因となるコンテナ/スライドの高さを制限しない限り、スクロール可能なコンテンツは実際には各スライドの内側にはありません。 その場合、スワイパーコンテナまたは他の親要素のscrollTopプロパティに注目する必要があります。

スクロールしているものに関係なく、イベントは初期化設定に追加された方がうまく機能します。あなたのjsfiddleのコードを使用するには：

var swiper = new Swiper('.swiper-container', { 
    pagination: '.swiper-pagination', 
    paginationClickable: true, 
    nextButton: '.swiper-button-next', 
    prevButton: '.swiper-button-prev', 
    spaceBetween: 30, 
    hashnav: true, 
    autoHeight: true, 

    // attach callback here 
    onSlideChangeEnd: function (swiperObj) { 
    $('.swiper-container').css('scrollTop', '0'); 
    } 
});