コアjQueryスクリプトを変更せずにスライダ（フレックススライダ）にトリガを追加する方法は？

Question

私は、スライドが変わったときにイベントを発生させなければならない状況に直面していますが、スライダはこれをサポートしていません。前と後の両方がサポートされています（http://www.woothemes.com/flexslider/#highlighter_298）

スライドが変更されたときに機能を起動する方法はありますか？ここで

はデモスライダーのURLです：私のスライドで http://flexslider.woothemes.com/thumbnail-slider.html

$(window).load(function() { 
     // The slider being synced must be initialized first 
     $('#carousel').flexslider({ 
     animation: "slide", 
     controlNav: false, 
     start: function(){},   //Callback: function(slider) - Fires when the slider loads the first slide 
     before: function(){},   //Callback: function(slider) - Fires asynchronously with each slider animation 
     after: function(){},   //Callback: function(slider) - Fires after each slider animation completes 
     animationLoop: false, 
     slideshow: false, 
     itemWidth: 210, 
     itemMargin: 5, 
     asNavFor: '#slider' 
     }); 

     $('#slider').flexslider({ 
     animation: "slide", 
     controlNav: false, 
     animationLoop: false, 
     slideshow: false, 
     sync: "#carousel" 
     }); 
    }); 

、私はスライドがアクティブなときに使用したいのrel属性を持つ（.flex-アクティブスライドは、アクティブに追加されます滑り台）。

<div class="flexslider"> 
    <ul class="slides"> 
    <li rel="divid1" class="flex-active-slide"> 
     <img src="slide1.jpg" /> 
    </li> 
    <li rel="divid2"> 
     <img src="slide2.jpg" /> 
    </li> 
    <li rel="divid3"> 
     <img src="slide3.jpg" /> 
    </li> 
    <li rel="divid4"> 
     <img src="slide4.jpg" /> 
    </li> 
    <!-- items mirrored twice, total of 12 --> 
    </ul> 
</div> 

現在のプロビジョニング（before：およびafter :)は、アクティブスライドの前にスライドのrel属性を取得できます。アクティブなスライドのrel属性を取得する方法はありますか？

Answer 1

beforeまたはafterコールバックを使用すると、アニメーションが開始または終了するイベントに関数をバインドできます。したがって、スライドアニメーションが終了した後にアクティブなスライドのrel属性を取得する場合は、そうすることができます。

$('#slider').flexslider({ 
    animation: "slide", 
    controlNav: false, 
    animationLoop: false, 
    after: function(){ 
     var active_rel = $(this).find('.flex-active-slide').attr('rel'); 
     //do something 
    }, 
    slideshow: false, 
    sync: "#carousel" 
});