Bootstrap Carousel内部的动画

Question

我正在寻找一种在引导轮播中提供动画的方法。我正在建立一个活动网站，在该网站中需要在转盘中放置有关该活动的信息（应该是动画支持的一些文本）。

有什么办法可以做到。我是一个初学者。

Answer 1

您必须执行此操作。

选项＃1（js）

使用slid.bs.carousel事件，在幻灯片转换完成时触发：

.carousel-caption {
    bottom: 600px;
}

$('#carousel-example-captions').on('slid.bs.carousel', function () {
    $(this).find('.active .carousel-caption').animate(
        {bottom: '20px'},
        '1000'
    );
})

选项＃2（无js）

使用具有.active类的CSS3过渡：

.carousel-caption {
    bottom: 600px;
    transition: bottom 1s ease;
}
.active .carousel-caption {
    bottom: 20px;
}