CODEWITHSUNDEEP
jquerybxslider
Hercules S.
Hercules S.

Reputation: 363

BxSlider4 first "next" slide arrow

I have a question on how to hide next arrow in first slide if no other slides exists yet. My slides are generated dynamically and everything works great. All I would like to achieve is to add class "disabled" to next arrow in controls if there is only 1 slide.

Thank you

Here is what I use but id doesn't do the job :(

$(document).ready(function(){

$('.bxslider').bxSlider({
  minSlides: 1,
  maxSlides: 1,
  slideWidth: 214,
  slideMargin: 5,
  infiniteLoop: false,
  hideControlOnEnd: true,
  pager: false  
}); 

if(slider.getSlideCount() < 0){
        slider.controls.next.addClass('disabled');
    }
});

Upvotes: 0

Views: 1106

Answers (2)

Evgeny
Evgeny

Reputation: 6290

Or, you could do it with CSS

.bxslider li:only-child .bx-next {
    // disabled rules
}

Upvotes: 0

Jai
Jai

Reputation: 74738

have you tried:

if($('ul.bxslider li').length == 1){
    $('.bx-next').addClass('disabled');
}

If you are having sliders in ul li then check for the length of the li's if that is one then disable the next btn.

Upvotes: 1

Related Questions