Question

我希望bxSlider重新启动，以便重新计算div尺寸，并在调整窗口大小时适应新的宽度和高度。

我想知道，在jQuery中你可以在resize上重新加载一个插件。

我想要那个简单的功能

//Home slider function
function hSlider(){
    $('.hCarousel').bxSlider({
        displaySlideQty: 3
    });
}

$(window).resize(function(e){
    hSlider();
}).resize();

要在resize()

上重新加载

这可能吗？

Answer 1

查看http://bxslider.com/options上的api，您应该可以调用其中任何一个函数。

destroyShow（）销毁活动幻灯片
reloadShow（）重新初始化   幻灯片放映

//Home slider function
$('.hCarousel').bxSlider({
    displaySlideQty: 3
});


$(window).resize(function(e){
   $('.hCarousel').reloadShow();
});

注意未经测试，但请阅读api

Answer 2

据我所知，调整大小函数没有问题，你问一下reinit bxSlider？看看这个答案：resetting bxSlider

reloadShow();

Answer 3

你应该可以从直接js调用resize事件的函数：

window.onresize = function(event) {     ... }

Answer 4

假设您的其余代码是正确的，我在创建滑块之前添加了destroyShow() ...

function hSlider(){
    $('.hCarousel').destroyShow().bxSlider({
        displaySlideQty: 3
    });
}

$(window).resize(function(e){
    hSlider();
}).resize();

bxSlider Documentation

Answer 5

我以同样的方式做，但使用underscore.js。

$(window).resize(_.bind(this.resizeList, this));

我认为你的错误就在这里：

$(window).resize(function(e){;  <----- REMOVE THIS ;
    hSlider();
}).resize();                     <----- And I think this is not necessary too

这样的事情应该这样做：

$(window).resize(function(e){
    hSlider();
});

在Resize上重新加载jquery插件

5 个答案: