Question

这是一个工作Bootstrap轮播的小提琴。 http://jsfiddle.net/jeykeu/5TDff/

这是官方文档，它没有说明事件的使用情况。 http://twitter.github.com/bootstrap/javascript.html#carousel

我认为这样可行但不是：

     $('#carousel').bind('slide',function(){
            alert("Slide Event");
    });

Answer 1

基于你的小提琴#carousel是错误的。它应该是#myCarousel。

更新示例：

$('#myCarousel').carousel({
    interval: 2000
});

// Could be slid or slide (slide happens before animation, slid happens after)
$('#myCarousel').on('slid', function() {
    alert("Slide Event");
});

http://jsfiddle.net/infiniteloops/wPF3n/

使用Bootstrap 3

http://jsfiddle.net/infiniteloops/wPF3n/252/

Answer 2

我知道的老帖子，但我想使用.on函数显示幻灯片和滑动。

所以，我的2美分...... JSFiddle

private void Grid_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    if (!tc.IsMouseOver)
        tc.Visibility = Visibility.Collapsed;
}

＆＃39; addClass＆amp; removeClass＆＃39;是为了表现出正在发生的事情的乐趣。此外，您可以将此与animate.css一起使用来添加/删除动画＆＃39; class to elements .on（slide，）。

$('#myCarousel').on('slide.bs.carousel', function (e) {
    $( '.carousel' ).removeClass('color-start');
    $( '.carousel' ).addClass('color-finish');
    $('#bind').html('Sliding!');
});

$('#myCarousel').on('slid.bs.carousel', function (e) {
    $( '.carousel' ).removeClass('color-finish');
    $( '.carousel' ).addClass('color-start');
    $('#bind').html('slid again!');
});

以上是我不喜欢提醒＆＃39;并且在较小的屏幕上显示console.log可能会很痛苦。

如何附加“幻灯片”＆amp; “滑动”事件到Bootstrap工具包的轮播？

2 个答案: