jquery - bxslider 不显示多张幻灯片

Question

我无法使用 bxslider 在 ie7、ie8 和 ie9 上制作多张幻灯片。

我有这个 jsfiddle：http: //jsfiddle.net/wJV3p/1/

$(document).ready(function () {
        var slider = $('.bxslider1').bxSlider({
            mode: 'fade',
            captions: false,
            minSlides: 3,
            maxSlides: 3,
            slideMargin: 10
            });
    });

我检查了 bxslider 的代码，在我看来一切都应该正常工作。

Answer 1

BxSlider 只允许您使用 mode="vertical" 或 "horizo​​ntal" 显示多个图像，而不是 mode="fade"。更改模式将解决您的问题。

Answer 2

为了将来参考，您可以将淡入淡出与多个水平幻灯片结合使用，只需稍加调整即可。

通过使用内置的callbacks onSlideBeforeand onSlideAfter，并应用一些自定义 js 让 deul元素在每张幻灯片之前淡出，并在幻灯片完成后淡入。

例如：http: //jsfiddle.net/wJV3p/22/

    $('.bxslider1').bxSlider({
     useCSS: false,
     easing: 'easeOutQuint',
     slideWidth: 100,
     minSlides: 1,
     maxSlides: 3,
     moveSlides: 3,
     slideMargin: 20,
     auto: true,
     pause: 5000,
     autoHover: true,
     speed: 0,
      onSlideBefore: function(){
        $(".bxslider1").fadeOut();
      },
      onSlideAfter: function(){
        $(".bxslider1").fadeIn();
      }
     });

Answer 3

虽然 BxSlider 文档确实显示了淡入淡出作为一个选项，但目前尚未实现。

https://github.com/wandoledzep/bxslider/issues/13

与此相关的 GITHUB 页面上有很多问题。选择一个新插件或推出你自己的插件:(