JQuery .hide() 没有定位丢失？

Question

我有以下简单的脚本，可以在加载页面时使网页的元素淡入。

$('#box1').hide();
$('#box1').delay(300).fadeIn(500);

我遇到的问题是，当隐藏时，#box1 不占用任何空间（因为它的类是可见的：none）。如何隐藏 #box1 以便它不会破坏依赖于其存在的其他浮动元素？

Answer 1

不知道您的情况是否可行，但您可以设置元素的不透明度，

$('#box1').css('opacity':0);

然后

$('#box1').delay(300).fadeTo(1,500);

Answer 2

将 #box1 放入包装器中并为其指定宽度和高度。现在，当您隐藏 #box1 时，包装器保持为空。

<div id="#wrapper">
  <div id="box1"></div>
</div>

#wrapper{
..
}

Answer 3

该代码可以正常工作，不会丢失位置，也不会崩溃。

（隐藏）

$("#name").animate({opacity:0});

（显示）

$("#name").animate({opacity:1});

Answer 4

JQuery的hidden相当于将display设置为none。目前这与：

$('#box1').css({"display":"none"});    

相反，尝试首先将对象上的 css 类设置为无可见性。比如：

$('#box1').css({"visibility":"hidden"});

然后

$('#box1').delay(300).fadeIn(500);