你如何避免JQuery的切换()上的布局DIV从造成你的布局走动?
题
我有一个JQuery的功能切换在我的布局的div之一。问题是,整个布局时,DIV出现或消失四处移动在屏幕上。有没有一种方法来达到同样的显示/隐藏效果,而不会改变布局?
<script>
$(document).ready(function(){
$("button").click(function () {
$("#layoutDiv").toggle();
});
});
</script>
解决方案
您可以包装该专区以保持适当的宽度/高度保持一致的布局DIV另一
<div style="width:300px;height:200px">
<div class="animateMe">
<p>When I close, the outer div will still be there.</p>
</div>
</div>
如果你不知道前手的高度/宽度,你可以以编程方式使用JavaScript加载页面时设置。刚刚得到的.WIDTH()和.height()可收缩的div的值,并且将它们应用到外div的CSS。
其他提示
尝试编写使用能见度新的功能:隐藏,而不是显示:无。这将保持CSS盒(和布局),而不显示在div。
乔纳森·桑普森的答案将工作 - 或者不知道究竟你在做什么(标记,以及所要求的效果)我会使用绝对定位高的z-index,这将拿出来公文流转。这是模态窗口/灯箱一般使用。这里的一个教程。
不隶属于 StackOverflow