jquery - 滚动 div 内容然后继续正文

Question

我有一个 div 容器，它占据了屏幕的 80%，左右各有 2 个固定侧边栏，它们各占 10%。我的 div 非常大，所以我在上面使用 overflow: hidden 来隐藏内容。当用户向下滚动时，它会忽略 div 并只滚动主体。

现在，如果我将 div 设置为 overflow:scroll，用户首先滚动 div，然后停止，并且不会滚动 body。

最后，我注意到，如果我将鼠标悬停在 oveflow: scroll div 上，它会滚动，但如果我将鼠标悬停在固定的侧边栏上，那么正文会滚动。

所有这些行为都不是我需要的。我想要我的 div:hidden 首先从上到下滚动，当它接近尾声时，然后 body 才开始滚动。

所以，我尝试检测，一旦我的 div 容器到达顶部，我就会:

$(#myDiv").focus()，但是，如果鼠标悬停在固定的边栏上，正文会滚动。

是否有任何解决方案来使这项工作正常进行？尤其是溢出:隐藏，似乎根本不可能滚动？

codepen.io/OrvaldMaxwell/pen/Yraryb 这是示例。我需要首先滚动名为“scrollMeAutoPLS”的 div，然后继续主体

Answer 1

简单:

$('#yourDiv').animate({ scrollTop:$('#yourDiv')[0].scrollHeight },800,function() {
    $('html,body').animate({ scrollTop:$(document).height() },800);
});

800 是以毫秒为单位的持续时间。