这可能是一个愚蠢的问题，但是我刚开始在jQuery中做一些漂亮的事情，突然间我想知道如何解决一个在没有框架帮助的情况下我从来没有打扰过的问题。
假设我们有两个div元素：
<body>
<div id="lorem1" style="display:block; height:400px;">
Lorem ipsum...
</div>
<div id="lorem2" style="display:hidden;">
dolor sit amet...
</div>
</body>
现在，如果我们想使用手风琴效果使第一个
div缩小为不存在，而将第二个#lorem1变为存在，我假设我们将具有以下简单逻辑：迭代地降低
#lorem1的高度，直到达到0将
display:none;设置为#lorem2将
display:block; height:0;设置为#lorem2反复增加
lorem2的高度然后是问题...增加lorem2的高度...直到什么时候？我们如何知道元素的最终高度？显然，我们不能选择“直到它增加到400px”之类的静态值，因为的内容可能超过400像素高。或者，如果小于400像素，则页面上的任何背景颜色/图像或其他元素可能看起来都不正确。
那么，我们如何确定何时停止手风琴？
最佳答案
使用jQuery，您可以使用方便的toggle属性：
$('#lorem').animate({
height: 'toggle'
});
我确信其他js库也提供了类似的可能性。
编辑：另一种方法是将对象设置为动画，直到高度
auto。或者不要通过CSS隐藏它，通过JS获取对象的尺寸，然后再使用JS隐藏它。现在您知道了再次显示它的尺寸。