2016/09/04

[JavaScript][jQuery]slickプラグインでスクロールイベントを検知する

slickプラグインでスクロールが完了した後にコールバックを受け取りたい場合はどうすればいいのだろうか?

解答としてはafterChangeメソッドをバインドすればおkみたい。

<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.on('afterChange',function(){
    console.log("scroll完了後に実行したいこと")
  });
  $slick.slick({
    autoplay:false
  });
  
});
</script>
確かに実行したらスクロール完了後にイベントがtrigger(トリガー)された。

0 コメント:

コメントを投稿