fadeOut（）和slideUp（）在同一时间？

我find了jQuery：FadeOut然后SlideUp ，这是好的，但它不是一个。

我怎样才能fadeOut()和slideUp()在同一时间？ 我用相同的延迟尝试了两次单独的setTimeout()调用，但是一旦页面加载， slideUp()发生了。

有没有人做过这个？

Answer 1

你可以做这样的事情，这是一个完整的切换版本：

 $("#mySelector").animate({ height: 'toggle', opacity: 'toggle' }, 'slow'); 

对于严格的淡出：

 $("#mySelector").animate({ height: 0, opacity: 0 }, 'slow'); 

Answer 2

直接设置animation高度会导致某些网页上出现抖动。 然而，将CSS转换与jQuery的slideUp()结合起来，使得平滑的消失行为。

 function slideFade(elem) { var fade = { opacity: 0, transition: 'opacity 0.5s' }; elem.css(fade).slideUp(); } slideFade($('#mySelector')); 

拨弄代码：
http://jsfiddle.net/00Lodcqf

这是我在dna.js项目中使用的解决scheme，您可以查看代码（ github.com/dnajs/dna.js ）以查看对切换和callback的额外支持。

Answer 3

“尼克·克雷弗”的答案肯定是要走的路。 我唯一要补充的是他的回答实际上并没有“隐藏”它，这意味着DOM仍然认为它是一个可行的元素来展示。

这可能是一个问题，如果你有'边缘'的边缘或填充'元素…他们仍然会显示。 所以我刚刚添加了一个callback函数animate（）来实际隐藏它完成后的animation：

 $("#mySelector").animate({ height: 0, opacity: 0, margin: 0, padding: 0 }, 'slow', function(){ $(this).hide(); }); 

Answer 4

我有类似的问题，并像这样修复。

 $('#mydiv').animate({ height: 0, }, { duration: 1000, complete: function(){$('#mydiv').css('display', 'none');} }); $('#mydiv').animate({ opacity: 0, }, { duration: 1000, queue: false }); 

队列属性告诉它是否排队animation或者马上播放

Answer 5

在@CodeKoalas基础上再抛一个细化。 它占垂直边界和填充，但不是水平的。

 $('.selector').animate({ opacity: 0, height: 0, marginTop: 0, marginBottom: 0, paddingTop: 0, paddingBottom: 0 }, 'slow', function() { $(this).hide(); });