web-dev-qa-db-ja.com

jquery FadeIn前のdivのFadeOutの後の1つの要素？

jQuery(document).ready(function(){
    $(".welcome").fadeOut(9500);
    $(".freelance").fadeIn(10000);
    $(".freelance").fadeOut(4500);
});

ウェルカムメッセージをゆっくりとフェードアウトしてから、他のdivをその場所でフェードインしてからフェードアウトするようにします。明らかにウェルカムボックスが存在しなくなったときです。

<header>
    <h1 class="left"><a href="index.html"></a></h1>
    <div class="left yellowbox welcome"><p>Welcome to my portfolio.</p></div>
    <div class="left greenbox freelance"><p>I am currently available for for work, contact me below.</p></div>
</header>
jqueryfadein
17
TheBlackBenzKid

最初のコールバック関数内の追加のfadeIn()およびfadeOutを呼び出す必要があります。 jQueryのすべてのアニメーションメソッド（および他の多くのメソッド）は、コールバックを許可します。

jQuery(document).ready(function(){
    $(".welcome").fadeOut(9500,function(){
        $(".freelance").fadeIn(10000, function(){
            $(".freelance").fadeOut(4500);
        });
    });
});

これにより、.welcomeが最初にフェードアウトします。フェードアウトが完了すると、.freelanceがフェードインします。フェードインが完了すると、フェードアウトします。

28
maxedison
jQuery(document).ready(function(){
   $(".welcome").fadeOut(9500, function() {
      $(".freelance").fadeIn(500, function () {
          $(".freelance").fadeOut(4500);
      });
   });
});
1
Joakim

このコードはうまくいくかもしれないと私は信じています

$(".welcome").fadeOut(9500).queue(function(next) { 
    $(".freelance").fadeIn(10000).queue(function(next) {
        $(".freelance").fadeOut(4500);
    });
});
0
jwchang

おそらく.delay（）が必要です

jQuery(document).ready(function(){
    $(".welcome").delay(9000).fadeOut(9500);
    $(".freelance").delay(10000).fadeIn(10000);
    $(".freelance").delay(145000).fadeOut(4500);
});
0
genesis