Javascript 自动播放时，推特引导转盘导航和内容不同步

我找到了一个twitter引导程序的片段，用于制作带有选项卡式导航的旋转木马。 除了“自动播放”外，一切正常

我希望旋转木马能够自行滑动，因此我使用

data interval=“1000”

问题：转盘导航选项卡与幻灯片不同步。幻灯片按预期设置动画，但选项卡保持不变

是否有一种干净的方法使选项卡与幻灯片同步更改？

演示：

---

感谢您的帮助

您必须使用

'slided.bs.carousel'

事件

小提琴：

JS：

$(document).ready(function(ev){
    $('#custom_carousel .controls a').on('click',function(){
        $('#custom_carousel .controls li.active').removeClass('active');
        $(this).parent('li').addClass('active');
    });
    $('#custom_carousel').on('slid.bs.carousel',function(){
            var j = $('.carousel-inner .item.active').index();
            $('.controls .nav li').removeClass('active').eq(j).addClass('active');
    });
});

SpidrJeru解决方案： 编辑

替代解决方案：

JS

 $(document).ready(function(ev){
    $('#custom_carousel').on('slide.bs.carousel', function (evt) {
      $('#custom_carousel .controls li.active').removeClass('active');
      $('#custom_carousel .controls li:eq('+$(evt.relatedTarget).index()+')').addClass('active');
    })
});

---

两种解决方案产生完全相同的效果。

这是有效的！谢谢你，伙计。很抱歉，我没有足够的代表来表扬你：（小规模的解决方案很有魅力，但我最终使用了另一种解决方案（在上面的编辑中）。我只是觉得有点干净。