javascript - 在 Jquery 中触发幻灯片更改

Question

我正在使用横​​幅滑块这个横幅滑块我想在其中触发一些事件 onSlide Change，默认情况下它不适用于此插件。

(".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正如您在每张幻灯片上看到的那样，更改了 class of 元素的样式属性，您可以使用DOMAttrModified该元素的事件：

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

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

});