通过将display设置为none并将visibility设置为hidden,我成功地使一个DIV标记在JavaScript中不可见。它也可以通过这个类来实现:
.invisible {
display: none;
visibility: hidden;
}
显示无将确保DIV框为空,隐藏可见性将确保其不可见。这种方法的问题是,当我有可滚动的DIVs或具有溢出内容的文本this时,当你设置display: none时,一些浏览器会忘记这些元素的滚动位置。有没有更好的方法使DIV不可见而不使用display属性?如果可能的话,我宁愿不使用JavaScript来记录滚动位置等。
编辑:
在你的帮助下,我成功地解决了这个问题,我应用了以下方法:
.invisible {
visibility: hidden;
position: absolute;
top: -9999px;
}
.visible {
visibility: visible;
position: static;
}
我试着向左:-9999px,但这会扩展IE中的垂直滚动条...我还将我的文本区域包装在另一个DIV中,并对其应用了可见/不可见样式,因为否则文本区域将失去其滚动位置。我在我的iPhone上用Chrome、火狐、IE和Safari进行了测试。需要注意的是,在FF中,围绕文本区的DIV似乎没有帮助,滚动条仍然重置。但是可滚动的DIVs现在很好用了。谢谢你的帮忙!
发布于 2011-02-25 11:26:00
这可能会起作用:
.invisible {
position: absolute;
left: -9999px;
}
编辑:我会看一看HTML5样板代码中的common helpers,以探索其他使事物消失的方法。
发布于 2011-02-25 11:24:47
如果您希望元素不可见但仍然呈现,则可以只使用visibility:hidden
。display:none
将完全删除它,并导致您提到的滚动行为。
发布于 2017-01-25 13:10:46
您可以使用jQuery
来获得解决方案。如果你想完全隐藏/显示div
,你可以使用:
$('#my_element').show()
$('#my_element').hide()
如果你想让你的div变得不可见,并且它仍然存在于页面中,那么你可以使用高效技巧:
$('#my_element').css('opacity', '0.0'); // invisible Maximum
$('#my_element').css('opacity', '1.0'); // visible maximum
https://stackoverflow.com/questions/5113246
复制相似问题