0

jquery キュー メソッドについて頭を悩ませています。私は次のコードを持っています。基本的に、関数 textScroll の 4 つの部分を次々に実行したいと考えています。どんな助けでも本当にありがたいです。

 $.fn.pause = function (n) {
  return this.queue(function () {
    var el = this;
    setTimeout(function () {
  return $(el).dequeue();
    }, n);
  });
};

function textScroll(){

    $('#winner1, #winner2').css("display", "block")
    .pause(4000)
    .animate({left: '-1000px'}, 2000);

    $('#winner3, #winner4').fadeIn()
    .pause(4000)
    .animate({left: '-1000px'}, 2000);

    $('#winner5, #winner6').fadeIn()
    .pause(4000)
    .animate({left: '-1000px'}, 2000);

    $('.winner_scroll').css("display", "none")
    .pause(1000)
    .css("left", "1000px");
    }
4

1 に答える 1

1

表示をなしに設定し、表示されていないときに移動する最後の部分がわかりません...奇妙に思えますが、とにかく:必要に応じて変数をハードコーディングできますが、表示するように作成しました簡単な例: これは、アニメーションのコールバックを使用して次のアニメーションを開始します。

var me = {
    left: "-1000"
};
var myani = 3000;
var mywait = 4000;

function textScroll() {
    $('#winner1, #winner2').css("display", "block").animate(me, myani, function() {
        $('#winner3, #winner4').fadeIn().delay(mywait).animate(me, myani, function() {
            $('#winner5, #winner6').fadeIn().delay(mywait).animate(me, myani, function() {
                $('.winner_scroll').css("display", "none").delay(1000).css("left", "1000px");
            });
        });
    });
}

CSS はこれで悪いです: http://jsfiddle.net/MarkSchultheiss/q3s9s/しかし、それは実際の例です。

于 2012-06-14T17:01:37.187 に答える