最近、めっきりサイトといえばレスポンシブ！というくらい
レスポンシブなサイトを作る機会が増えました
で、以前はスライダーといえば「bxslider」を使用していたのですが
カルーセルの時、スマホおよびタブレット表示でずれちゃったり・・・うまくブレイクポイントで表示してくれなかったりして
こりゃダメだな～と違うものを探して使う事になりました
そこで！見つけたのが「slick.jsスライダー」
これが良い所は！ブレイクポイントを設定できるところです！！！
使い方は色んなブログ等でご親切なお方がたがご紹介されているので割愛ですが
<script>
$(‘.slide（任意のクラス）’).slick({
dots: false,
infinite: true,
speed: 300,
slidesToShow: 3,
slidesToScroll: 3,
responsive: [
{
breakpoint: 1024,
settings: {
slidesToShow: 3,
slidesToScroll: 3,
infinite: true,
dots: true
}
},
{
breakpoint: 768,
settings: {
slidesToShow: 2,
slidesToScroll: 2
}
},
{
breakpoint: 480,
settings: {
slidesToShow: 1,
slidesToScroll: 1
}
}
]
});
</script>
と！こんな具合に</body>直前に書きかきしてしまえば
自分でブレイクポイントの設定が出来てしまう優れもの！！！
とっても素敵ですね！
今度からこれ！つ～～～かおっと！
覚書として書きました★