为什么淡入淡出和动画不能同时发生？答案

【问题标题】：Why do the fadeIn and animate not happen at the same time?为什么淡入淡出和动画不能同时发生？
【发布时间】：2011-06-15 06:48:04
【问题描述】：

为什么动画在执行之前要等待淡入完成，谁能帮我解释一下？

//Price Navigation FadeIn

$('#header-base > ul').hide().css({'top':'50px'});

$('#header-base > ul').fadeIn(500);
$('#header-base > ul').animate({'top':'0px'});

我希望淡入和动画同时发生。

【问题讨论】：

标签： javascript jquery html css animation

【解决方案1】：

问题在于动画会自动放入效果队列中。您可以通过提供 queue 设置来更改此设置：

$('#header-base > ul').animate({top: '0px'}, {queue: false});

请参阅animate API。

【讨论】：

【解决方案2】：

不知道为什么它们不会同时发生，但快速解决方法是

将元素的不透明度设置为 0
显示元素
为您的动画功能添加不透明淡入...

也许是……

$('#header-base > ul').css({'top':'50px', 'opacity':'0'});
$('#header-base > ul').animate({top:'0px', opacity: 100}, 500);

【讨论】：

但是在不支持不透明度的旧浏览器中不会有问题，特别是ie？
@jai 我想它可能是的。不过，我相信 lonesomeday 找到了真正的问题。