bx 滑块在少于 4 个幻灯片时会损坏

Question

我在项目中使用 BX 滑块，并且在 destroy.slider() 方法中遇到一些问题 - 我的客户通过 CMS 添加图像，因此滑块的每个实例都有一个可变的幻灯片数量。当幻灯片少于 5 张时，我试图杀死滑块并返回到正常显示状态（这是一个没有任何控件的网格）。阅读文档后，我认为这会起作用，但运气不佳 - 即使 getSlideCount 返回 2，滑块仍保持完好。欢迎任何建议！

谢谢！

var slider = $('#view-profiles').bxSlider({
  minSlides: 4,
  maxSlides: 4,
  nextSelector: '.next',
  prevSelector: '.back',
  slideWidth:   '220px',
  pager: false,
  slideMargin: '0',
  nextText: '',
  prevText: '',
  infiniteLoop:false,
  hideControlOnEnd: true



}); 

if (slider.getSlideCount() < 5){
  slider.destroySlider();
}

Answer 1

试试这个

var total_slide = slider.getSlideCount() ;

if (total_slide  < 5){
  slider.destroySlider();
}

或

var slider = $('#view-profiles').bxSlider({
  minSlides: 4,
  maxSlides: 4,
  nextSelector: '.next',
  prevSelector: '.back',
  slideWidth:   '220px',
  pager: false,
  slideMargin: '0',
  nextText: '',
  prevText: '',
  infiniteLoop:false,
  hideControlOnEnd: true,
  onSliderLoad:function() 
            {
            if (slider.getSlideCount() < 5){
            slider.destroySlider();
            }    
 }
}); 

Answer 2

if($('#view-profiles > div').length > 4){
            var slider = $('#view-profiles').bxSlider({
                  minSlides: 4,
                  maxSlides: 4,
                  nextSelector: '.next',
                  prevSelector: '.back',
                  slideWidth:   '220px',
                  pager: false,
                  slideMargin: '0',
                  nextText: '',
                  prevText: '',
                  infiniteLoop:false,
                  hideControlOnEnd: true   
                });
    }