要素の数によってbxSliderの挙動を変更する

【挙動について】
１、共通設定となる（infiniteLoopを設定していない状態）bxSliderを定義
２、要素の数によって挙動の出し分け
３、bxSliderをリロードする

// 共通の初期設定の配列
var defaultOpt = {
 speed: 900,
 minSlides: 3,
 maxSlides: 3,
 moveSlides: 1,
 slideWidth: 270,
 slideMargin: 15,
 pager: false,
 auto: true,
 pause: 4500,
 autoHover: true
};
var slider = $('#slider').bxSlider(defaultOpt); // 上記で設定した内容でbxSliderを定義
if( slider.getSlideCount() < 4 ) {
 // スライダー3つ以下のとき
 defaultOpt['infiniteLoop'] = false;
} else {
 // スライダー4つ以上のとき
 // prev/nextのリンクをクリックするとbxSliderのautoがfalseになってしまうので、再度autoをセットする
 $(document).on('click', 'a.bx-prev, a.bx-next', function(){
 slider.startAuto();
 });
};
 
// スライダーをリロードする
slider.reloadSlider();

参考サイト

Tips Note by TAM

【jQuery】要素の数によってbxSliderの挙動を変更する

https://www.tam-tam.co.jp/tipsnote/javascript/post4363.html