Question

我有一个隐藏可见性的div，我将文本放入数据库的div中，所以不知道它的高度。

我想做的是制作一个动画，它会增加div的大小，直到所有文字都可见。到目前为止我所拥有的是：

function display_form () {
    $("#form_container").css("visibility", 'visible');
    $("#form_container").animate({
        height: $("#form_container").height(),
    }, 1500);
}

<div id="container">
    <div id="form_container"><?php echo $form; ?></div>
    <div id="content">
        some stuff here which should slide down as the form_container div gets bigger
    </div>
</div>

所以我的问题是隐藏了我的form_container，但它的大小仍然存在，所以我有很大的空白空间。如果我将其大小设置为0px，那么我无法知道它的实际大小......

Answer 1

我认为你不需要弄乱visible CSS属性。

在你的CSS中做这样的事情：

#form_container { display: none; }

然后你的display_form函数可以这样做：

function display_form() {
    $('#form_container').slideDown(1500);
}

Answer 2

看一下jQuery的slideDown。那你就不用担心自己的身高了。

Answer 3

不确定你是如何从数据库中获取文本的，但是如果你最初隐藏了div，那么将文本放在div中，然后你可以简单地使用该div上的slideDown（1000）函数，如下所示： $（ '＃mydiv'）了slideDown（1000）。 div将向下滑动，直到显示所有内容。

jQuery动画div大小

3 个答案: