0

twitter bootstrap.jsのコールバック「slid」を使用して、スライドからスライドに移行した後、ピースを個別にアニメーション化しようとしています。

<div class="carousel">
    <div class="item active">
        <img src="animatefirst.png">
        <h1> second </h1>
        <p> third <p>
    </div>

    <div class="item">
        <img src="animatefirst.png">
        <h1> second </h1>
        <p> third <p>
    </div>

    <div class="item">
        <img src="animatefirst.png">
        <h1> second </h1>
        <p> third <p>
    </div>

</div>

ご覧のとおり、次の順にアニメーション化したいと思います。

  1. img
  2. h1
  3. p

どうすればいいですか？

これまでのところ、これが私にできることのすべてです。

$('#carousel2').bind('slid', function(){
    $('img').fadeIn();
});

しかし、上記の問題は、最初のスライドが一度にすべての画像をフェードインし、「スライド」することです。div内の画像をターゲットにして、1つずつフェードインする方法はありますか？

4

1 に答える 1

0

そこにいる誰にとっても、私は解決策を見つけました：

Bootstrapは、「アクティブ」と呼ばれるクラスをカルーセル内の現在のアイテムにアタッチします。

子孫セレクターを使用して、アニメーション化に必要なすべての子要素をターゲットにし、アニメーションを作成しました。

于 2013-02-19T00:18:20.393 に答える