0

こんにちは、私はスライダーを選択してウィンドウの幅を動的に変更し、正しい変数「newscount」を「slidesPerSlide : window.newscount」に置き、最後の部分をリロードしようとしています:

swiperLoop = $('.swiper-loop').swiper({
    slidesPerSlide : window.newscount,
    loop:false
}); 

私を助けてください、コードは以下の通りです:

$(window).on('load', function(){

    $(window).on('resize', function() {
        var w = $(window).width();
        if (w < 321) {
            var newscount = "2";
        }
        else if (w < 480) {
            var newscount = "3";
        }
        else if (w < 640) {
            var newscount = "5";
        }
        else if (w < 720) {
            var newscount = "8";
        }
        else if (w > 721) {
            var newscount = "8";
        }
    }); 

    swiperLoop = $('.swiper-loop').swiper({
        slidesPerSlide : window.newscount,
        loop:false
    });

});
4

2 に答える 2

1

ウィンドウ サイズに基づいてスワイパーを初期化slidesPerSlideし、window.resizeイベントのパラメーターを更新する必要があります。

$(function(){
    var width = $(window).width();

    var swiperLoop = $('.swiper-loop').swiper({
        slidesPerSlide: getSlideCount(width),
        loop: false
    });

    $(window).on('resize', function() {
        width = $(window).width();
        swiperLoop.params.slidesPerSlide = getSlideCount(width);
    }); 
});

function getSlideCount(windowSize) {
    if (windowSize < 321) {
        return 2;
    } else if (windowSize < 480) {
        return 3;
    } else if (windowSize < 640) {
        return 5;
    } else {
        return 8;
    }
}

また、windowオブジェクトにグローバル変数を追加しないことをお勧めします。これにより、他のライブラリで競合や予期しない動作が発生する可能性があります。

于 2013-06-06T15:13:39.513 に答える
0

$(window).on('load', function(){

$(window).on('resize', function() {
    var w = $(window).width();

    this.newscount="0";

    if (w < 321) {
        this.newscount="1";
    }
    else if (w < 480) {
       this.newscount="2";
    }
    else if (w < 640) {
      this.newscount="3";
    }
    else if (w < 720) {
       this.newscount="4";
    }
    else if (w > 721) {
        this.newscount="5";
    }
}); 

swiperLoop = $('.swiper-loop').swiper({
    slidesPerSlide : this.newscount,
    loop:false
});

});

于 2013-06-06T15:15:03.587 に答える