Bootstrap 轮播（carousel）滑动触发事件问题

Question

我尝试使用这段代码在轮播滑动时触发事件，但由于某些原因它无法正常工作。有什么建议吗？

var $carousel = $('#carousel-showcase');
$carousel.carousel();

$carousel.bind('slide', function(e) {

  setTimeout( function(){
    var left = $carousel.find('.item.active.left');
    var right = $carousel.find('.item.active.right');
    if(left.length > 0) {
    $("#wrap").animate({
        backgroundPositionX: '+=50%'
    },0);
    }
    else if(right.length > 0) {
    $("#wrap").animate({
        backgroundPositionX: '-=50%'
    },0);
    }
  }, 500);
});

- sdvnksv

Answer 1

Bootstrap 3将“slide”事件更改为“slide.bs.carousel”。更改为此事件，它应该可以正常工作（假设这是您唯一的问题）：

Bootstrap 3 将 'slide' 事件更改为 'slide.bs.carousel'。更改为此事件，它应该可以正常工作（假设这是您唯一的问题）：

$carousel.bind('slide.bs.carousel', function (e) {
    console.log('slide event!');
});

请参见这个问题。

- ringstaff

---

它在Chrome中可以工作，但在Mozilla中无法工作。有什么建议吗？ - sdvnksv

是的，事实证明Mozilla在使用animate(backgroundPositionX)时存在问题。我通过一个插件成功解决了这个问题。现在它可以正常工作了。 - sdvnksv

我已经到处寻找这个问题的答案，最终得到了这个答案。谢谢。 - Pupil