Flexslider和Easytabs

funde 发布于 2019-03-09 flexslider 最后更新 2019-03-09 14:34 2 浏览

我希望标签在滑块到达最后一个项目时循环到下一个标签。 这是fiddle。我把flexslider旋转木马放在jquery easytabs内。 由于我只是一个初学者,这是我的脚本:

if (target === slider.last) {
  EASYTABS MOVE AUTOMATICLY TO THE NEXT TAB       
}

调整 对不起。我只有一个easytab有4个选项卡(面板),每个人都有一个旋转木马。当flexslider到达最后一个项目时,我想循环它们。可能吗?
已邀请:

mest

赞同来自:

我想我正确地解释了你的问题:你在页面上有一个flexslider幻灯片和一组easytabs选项卡,你希望每次幻灯片结束时选择下一个选项卡,永久循环,对吗? 如果是这样 ... Flexslider有一个名为'end'的回调,当幻灯片显示到达最后一张幻灯片时会触发,因此您需要绑定一个方法,使您的选项卡增加到flexslider调用中的以下内容:

// an array of the selectors for the tabs themselves
easyTabSelectors = ['#tab-1','#tab-1','#tab-1'];
// a reference to the currently active tab by index in the array easyTabSelectors
currentEasyTab = 0;
// create your flexslider
$("#flexslider-container").flexslider({
//Put all your other flexslider config stuff here
// bind to the 'end' callback
  end: function () {
    currentEasyTab++; // increment the currentEasyTab variable
// if the currentEasyTab is now a tab too far, start over
    if (currentEasyTab = easyTabSelectors.length)
      currentEasyTab = 0;
// use the easytab 'select' method to select the next tab using the array and reference
    $('#easy-tab-container').easytabs('select', easyTabSelectors[currentEasyTab]);
  }
});
如果您正在寻找幻灯片也在此时停止循环,那么您也可以这样做。 Flexslider有很多方法和回调可供使用。 参考文献:   - flexslider docs / advanced /所有可用的FlexSlider属性:http://www.woothemes.com/flexslider/   - easytabs公共方法选择选项卡:http://os.alfajango.com/easytabs/#public-methods