Question

我有一个DIV，内容是使用jQuery动态插入的。我希望这个div看起来好像是从大小0px放大到它假设在用它的内容渲染div时要采用的大小。

内容是文本，因此我没有关于将其附加到文档后所需的大小的信息。当我知道最终尺寸时，我知道如何使用jQuery Animate为div设置动画，但是当我不知道它时，我不知道该怎么做。

如果我使用width: "+=10"，我会得到一个大于我没有动画的div。感谢。

Answer 1

插入项目，保存宽度和高度，然后将项目的宽度和高度设置为零。这将发生得太快而不可见，并且您将拥有动画所需的最终宽度和高度值。

var $div = $('<div>', {
    text: <your text>
});

// <append your element>

var width = $div.width();
var height = $div.height();

$div.css({
    width: 0,
    height: 0
});

$div.animate({
    width: width,
    height: height
}, {
    duration: 'slow',
    easing: 'linear'
});

使用jQuery动画DIV大小，而不知道最终大小

1 个答案: