2016/06/09

[jQuery][slick]slickプラグインをレスポンシブ対応

slickプラグインを使った時、レスポンシブつまりwindowリサイズに対応させたい場合は、どうすればいいのだろうか?

<link rel="stylesheet" type="text/css" href="./slick.css"/>
<link rel="stylesheet" type="text/css" href="./slick-theme.css"/>
<script type="text/javascript" src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script type="text/javascript" src="./slick.min.js"></script>
<div class="_slick">
  <div>1</div>
  <div>2</div>
  <div>3</div>
</div>
<script>
jQuery(function($){
  var $slick = $('._slick');
  $slick.slick({
    responsive: [
      {
        breakpoint: 320,
        settings: {
        }
      }
    ]
  });
});
</script>
responsiveパラメータに配列で、breakpointとsettingsを設定すればおk

0 コメント:

コメントを投稿