jQuery隐藏元素,同时在页面布局中保留其空间

Question

有没有一种方法可以在jQuery中隐藏一个元素,但是当隐藏它时不能更改DOM？我隐藏了某个元素但是当它被隐藏时,它下面的元素会向上移动.我不希望这种情况发生.我希望空间保持不变,但随意显示/隐藏的元素.

我可以这样做吗？

Answer 1

而不是hide(),使用:

css('visibility','hidden')

hide()将display样式设置为none,从文档流中完全删除元素并使其不占用空间.

visibility:hidden 保持空间不变.

Answer 2

尝试设置visibility为hidden:

$("#id").css("visibility", "hidden");

Answer 3

display: none;将它从内容流中取出,这样你就会看到你的其他内容进入留下的空白区域.(display: block;把它带回到流程中,将所有东西都推开.)

visibility: hidden;将它保留在占用空间的内容流中,但只是让它不可见.(visibility: visible;会再次透露.)

visibility如果您希望内容流保持不变,则需要使用.

Answer 4

在另一个答案中,注意到jQuery fadeTo没有display:none在完成时设置,所以也可能在这里提供解决方案,而不是使用fadeOut例如:

Answer 5

opacity: 0在我看到这个visibility: hidden技巧之前我曾经使用过.

但在许多情况下opacity: 0是有问题的,因为它可以让你与元素进行交互,即使你看不到它!(正如DeadPassive所指出的那样.)

通常这不是你想要的.但也许你偶尔会这样？