jQuery .wrapAll() 重置嵌套元素的滚动

Question

请看下面的小提琴：

http://jsfiddle.net/ardoramor/UzJqd/

当小提琴加载时，带有 .wrapper 类的 DIV 向下滚动 200 像素。这包括所有嵌套的.wrapper. DIVs as well. After 5 seconds, trigger.wrapAll()will be executed on the children of.container. The content of the.containerclass will be wrapped by a new DIV with.wrapAllclass. You will notice that the red and blue areas jump and you can now see the topand`元素。这是由于包装而发生的。

注意：这是一个非常简化的示例。实际上，我现在将知道.wrapper DIV 的内容。此外，可能有多个带有滚动的此类元素。我的问题是容器的孩子是否可以在不重置滚动条的情况下被包装。

Answer 1

在包裹前保存scrollTop，包裹后恢复。

var st = $( '.wrapper' ).scrollTop();
$( '.container' ).children().wrapAll( '<div class="wrapAll">' );
$('.wrapper').scrollTop(st);

更新小提琴：http://jsfiddle.net/JR6y8/1/

Answer 2

试试这个：

setTimeout( function () {
        $( '.container' ).children().wrapAll( '<div class="wrapAll">' ).scrollTop($('.container').height());
    }, 5000 );
});

Answer 3

只需将滚动代码放在 wrapAll 函数之后

$( '.wrapper' ).scrollTop( 200 );