jQuery fadeout没有显示没有？

有没有替代fadeOut（）不使用display：none的样式？ 我想只隐藏可见性，以避免在页面布局中的任何转移？

Answer 1

你可以直接在opacity上使用.animate()

 $(".selector").animate({ opacity: 0 }) 

这样，元素仍然像你想要的那样占据空间，它只是一个0不透明度，所以它和visibility: hidden 实际上是一样的visibility: hidden当它完成时visibility: hidden 。

Answer 2

是的，还有一个select。 它被称为.fadeTo() ，在那里你设置目标不透明度，在你的情况下将是0 。

 $('element').fadeTo( 1000, 0 ); // fade to "0" with a 1000ms duration 

这将不会改变最后的display属性。

Answer 3

自定义animation是一种替代http://api.jquery.com/animate/

 .animate({opacity: 0.0}, 5000, 'linear', callback); 

Answer 4

这样做的一个方法是捕获显示模式，然后.fadeOut，并在完整，做你喜欢的隐藏方法，并设置显示回到它是什么：

 var $element = $('#selector'); var display = $element.css('display'); $element.fadeOut(500, function() { $element.css('visibility', 'hidden'); $element.css('display', display); } 

Answer 5

我想要淡出 ，然后改变内容，然后再次淡入 ：

 $("#layer").animate({opacity: 0}, 1000, 'linear', function(){ //Do here any changes to the content (text, colors, etc.) $("#layer").css('background-color','red'); //For example $("#layer").animate({opacity: 1}); //FadeIn again }); 

Answer 6

注意

 fadeTo(500, 0) // fade out over half a second fadeTo(0, 0) // instantly hide 

（奇怪）不兼容

 fadeIn() 

（当你想再次显示）。 所以如果你正在使用

fadeTo(500, 0)

为了隐藏没有CSS display: none东西display: none那么你必须使用

fadeTo(500, 1)

将其淡入或者仍然具有opacity: 0留在CSS中并将保持隐形。