我面临的情况是,当幻灯片更改但我的滑块不支持此操作时我必须触发事件.支持之前和之后(
http://www.woothemes.com/flexslider/#highlighter_298)
这是演示滑块的网址:
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",animationLoop: false,sync: "#carousel" }); });
在我的幻灯片中,我有一个rel属性,我想在幻灯片处于活动状态时使用(.flex-active-slide被添加到活动幻灯片中).
<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>