CODEWITHSUNDEEP
jquerybxslider
TheNameHobbs
TheNameHobbs

Reputation: 729

bxslider not showing multiple slides

I'm having trouble getting multiple slides with bxslider to work on ie7,ie8, and ie9.

I have this jsfiddle: http://jsfiddle.net/wJV3p/1/

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

I checked the code from bxslider and it seems to me like everything should be working.

Upvotes: 1

Views: 4819

Answers (3)

user3982127
user3982127

Reputation:

For future reference, you CAN use fade in combination with multiple horizontal slides, thought only with a little tweaking.

By using the built-in callbacks onSlideBefore and onSlideAfter, and applying a little custom js to let de ul element fade out before each slide, and fade in after the slide completes.

E.g: 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();
      }
     });

Upvotes: 3

Stone
Stone

Reputation: 2668

While the BxSlider documentation does show fade as an option, it is not currently implemented.

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

There's MANY issues on the GITHUB page related to this. Choose a new plugin or roll your own :(

Upvotes: 0

Mogens Madsen
Mogens Madsen

Reputation: 31

BxSlider will only allow you to show multiple images with mode="vertical" or "horizontal" and NOT with mode="fade". Changing mode will solve your problem.

Upvotes: 3

Related Questions