便乗してスライダーのご紹介

こんにちわ、かずです。
火曜日担当ですが遅くなりましたすみません！

以前さやさんがスライダーの記事を紹介していましたので、便乗！

使いやすいスライダープラグイン２選「slick」「Swiper」紹介

自分も基本的にスライド関連は紹介されている「slick」か「swiper」の2択です。
個人的には「swiper」が好きなんですが、実務だと「slick」が多いかなーといった感じです。

そんな中今回ご紹介するのはこちら

bxSlider

公式はこちら

以前にこんなスライドをつくる案件がありました。

まずは上記2つで試しました。
しかし、調べた限りでは条件1・2は満たせるものの3・4が実現出来ませんでした・・・

そこで使ってみたのが【bxSlider】です！

書いたコードはこちら↓↓ （※htmlは省略）

const slider = $('#slider'),
　　　slideSpeed = 10000,
　　　slideLength = slider.find('.slide').length;
slider.bxSlider({
　　ticker: true,
　　tickerHover: true,
　　useCSS: false,
　　pager: false,
　　easing: 'linear',
　　slideWidth: 'auto',
　　speed: slideSpeed * slideLength,
　　controls: false,
});

ざっくりなのでサイトに合うよう調整してください・・・

こんな形の記述で条件3・4も満たしたスライドの出来上がりです！

もっとよくドキュメントを読み込めばswiperやslickでも出来たかもしれませんが、時間との勝負もありましたので・・・（逃げ）

もう使うこともないかなーと思っていたbxSliderがこんな形で活躍するとは！とちょっと衝撃も受けつつも、選択肢が広がるいい案件でした。
どなたかの参考になれば幸いです！

それでは。