jquery - 处理随着选项卡变化而变化的 DIV 高度

Question

我有一个带有四个子 div 的顶部 div 的选项卡式设置 - 单击选项卡显示/隐藏使用 jquery 的内容，方法是将新 div 从 display:none 更改为 display:block 并将旧 div 更改为 display:none。我发现这种方法不令人满意，因为有时可见的新 div 的高度比旧的要小，如果向下滚动，页面会“跳转”到页面的新底部。

改变这种行为的最佳方法是什么，以免发生跳跃——例如，尽管切换，仍保持 div 高度？

Answer 1

新内容加载后，设置新的滚动条位置。

//Permits to reset the scrollbar to the top
$('#content-div').scrollTop(0);

//Permits to reset the scrollbar to the bottom
$('#content-div').scrollTop($('#content-div').height());

您还可以存储当前位置并在内容加载后应用。

我不知道您如何加载新内容。我假设您正在使用 JQueryload函数：

$('#content-div').load('new.php',function(){
    $(this).scrollTop(0);
});