javascript - Jqueryでスライド変更をトリガーする

Question

私はバナースライダーを使用しています。これはバナースライダーです。スライド変更でイベントをトリガーしたい場合、デフォルトではこのプラグインでは使用できません。

(".slidebox").mSlidebox(function()
{
   //My action trigger here
});

どうすればそれを達成できますか？

Answer 1

ここで関数を定義できます

slideboxNext.click(function(e){
    e.preventDefault();
    SlideboxAction("next","stop");
        YOUR FUNCTION HERE
});
slideboxPrevious.click(function(e){
    e.preventDefault();
    SlideboxAction("previous","stop");
        YOUR FUNCTION HERE
});

自動再生モード。

slideboxSlide.each(function(index){
    if(options.numberedThumbnails){
        slideboxThumbs.append("<a href='#' class='slideboxThumb' rel='"+(index+1)+"'>"+(index+1)+"</a>");
    }else{
        slideboxThumbs.append("<a href='#' class='slideboxThumb' rel='"+(index+1)+"' />");
    }
    $(this).attr("rel",index+1).addClass("slideboxSlide slideboxSlide_"+(index+1)).children().addClass("slideboxCaption");
    slideboxTotalWidth=(index+1)*slideboxWidth;
    slideboxSlides.css("width",slideboxTotalWidth);
    slideboxEnd=index*slideboxWidth;
    YOUR FUNCTION HERE
});

お役に立てれば。

Answer 2

slideboxSlides各スライドでクラスが変更された要素のスタイル属性を確認できるようDOMAttrModifiedに、この要素のイベントを使用できます。

(".slidebox").mSlidebox(function()
{

document.getElementsByClassName('slideboxSlides').addEventListener('DOMAttrModified', function(e){
  if (e.attrName === 'style') {
    // My action trigger here...
  }
}, false);

});