jquery Fade在FadeOut之前的div之后的一个元素？

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

我希望欢迎消息慢慢地淡出，然后另一个div淡出它的位置，然后淡出 - 显然当欢迎框不再存在时。jquery Fade在FadeOut之前的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>

来源

2011-09-24 TheBlackBenzKid

问题是，两个盒子同时出现，然后两者都在同一时间淡出/ ish – TheBlackBenzKid

你需要调用的内部附加fadeIn()和fadeOut回调函数到第一个。 jQuery中的所有动画方法（和许多其他的）允许回调：

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

这将导致.welcome先淡出。一旦完成淡出，.freelance将淡入。淡入淡出后，淡出。

来源

2011-09-24 13:10:39 maxedison

我得到它通过隐藏它首先使用你的代码的工作： “自由职业者 ” jQuery的（文件）。就绪（函数（）{ \t $（）隐藏（）; \t $（“ 欢迎”）。 fadeOut（6500，function（）{（“。freelance”）。fadeIn（2500，function（）{$（“。freelance”）.fadeOut（4500）; }）; }）; }） ; – TheBlackBenzKid

谢谢你的解决方案。 – TheBlackBenzKid

你也可以在你的css中放置display：none for .freelance ... – maxedison

我相信，此代码的工作

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

来源

2011-09-24 13:08:49 InspiredJW

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

来源

2011-09-24 13:09:06 Joakim

几乎是正确的，除非您需要将.freelance的fadeOut放在fadeIn调用的回调函数中.freelance 。您当前的代码在同一时间内都会自动进入和退出。 – maxedison

@maxedison谢谢你，它仍然按照它的意思行事，无论如何编辑我的答案。 – Joakim

你可能想.delay（）

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

来源

2011-09-24 13:09:16 genesis

jquery Fade在FadeOut之前的div之后的一个元素？

回答

相关问题