2

自動再生用にシーケンス スライダーを設定しましたが、2 番目のスライドまでスライドしてから停止します。スライドする必要があるスライドは 7 つあります。

設定したオプションのコードは次のとおりですが、スライド 2 の後で停止する理由がわかりません。CSS トランジションの問題でしょうか? 私は困惑しています！

$(document).ready(function(){
var options = {
    autoPlay: true,
    autoPlayDelay: 1000,
    nextButton: true,
    prevButton: true,
    preloader: true
};
var sequence = $("#sequence").sequence(options).data("sequence");

sequence.afterLoaded = function(){
    $(".prev, .next").fadeIn(500);
}
});

ウェブサイトはこちら - http://aald.captechnix.com/

4

2 に答える 2

5

今日、同じ問題が発生し、ソース コードをざっと見てみました。次のフレームに移動する前にアニメーションがいつ終了したかを判断するために、sequence.js は各フレームの直接の子を調べているようです。あなたの例を見ると、各スライドの直接の子にトランジションがないように見えるため、内部で sequence.js がこれらの要素の「animationEnded」プロパティを true に設定することはなく、次のスライドへの移動を拒否します。

各スライドのすべての直接の子に少なくとも .animate-in トランジションがあり、その要素の値が実際にトランジションされることを確認してください。したがって、あなたの場合は、次の css を追加してみてください (ベンダー プレフィックスは省略しました)。

#sequence .width {
 transition: all 1s linear;
 z-index: 9999;
}
#sequence .animate-in .width {
 z-index: 9998; /* or some other property as long as it changes */
}

#sequence-theme img {
 transition: all 0.1s linear;
 opacity: 0;
}
#sequence-theme .animate-in img {
 opacity: 1; /* or some other property as long as it changes */
}
于 2013-04-18T00:33:43.263 に答える