jquery动画包装vs追加

Question

我有以下jQuery：

        var container = $(this),
            list = container.children('ul'),
            wrapper = $('<div class="wrapper"></div>');

        list.wrap(wrapper);

        var top = 0 - list.height();
        wrapper.animate({ 'top':  top + "px" }, options.animationSpeed, function () {
        });

但是这不会给包装器设置动画，但是，如果我使用以下代替.wrap

        container.append(wrapper.append(list));

动画将有效。

为什么第二个版本有效但第一个版本没有？

Answer 1

这是因为wrapper的标记被复制到DOM中，并且列表被附加到副本，而不是原始的wrapper对象，它仍然在DOM之外。

明确提到列表的新父母应解决您的问题：

list.parent().animate({
    top: top + "px"
}, options.animationSpeed, function() {
});