Question

我在幻灯片出现时尝试更改CSS值。我已经检查了一个类似的问题并尝试了这种方法，但到目前为止我还没有运气。

我知道我可以用CSS完成这个，但我更喜欢使用jQuery，因为我有很多动画要做。

＆＃13;

$('.slide-header').on('slid.bs.carousel', function () {
    $(this).find('.active .slide-header').css('display', 'block');
    );
});

＆＃13;

.slide-header {
	display: none;
}

＆＃13;

<div class="item active" id="item-one">
    <div class="container">
        <div class="carousel-caption">
            <h1 class="slide-header">Slide Header</h1>
            <p class="slide-description">Slide Description</p>
        </div>
     </div>
</div>

＆＃13;

Answer 1

http://jsfiddle.net/xbak4maj/1/

事件应附在旋转木马上而不是滑动：

<强> HTML：

<div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
  ...
  <div class="item active" id="item-1">
  ...
  <div class="item active" id="item-2">
  ...
</div>

<强> JQ：

$('#carousel-example-generic').on('slid.bs.carousel', function () {

    $(this).find('.active .slide-header').css('display', 'block');
})

jQuery动画和bootstrap轮播

1 个答案: