Question

http://api.jquery.com/scroll/

当你一直向下滚动页面时，会有一个演示窗口。当我们滚动到该演示窗口的顶部，并且我们继续滚动甚至我们的鼠标在演示窗口中，整个页面滚动。当我们做同样的事情但滚动到演示窗口的底部时，整个页面向下滚动。

任何人都可以解释这是如何工作的？如果我能看到实际的代码，那就太好了。谢谢！

Answer 1

代码就在演示之上。在内部，将在html中执行代码，您可以通过右键单击页面并检查元素来找到这些代码。

Answer 2

不是代码，而是浏览器功能。当您的滚动在顶层完成并且您的鼠标出现在子元素上时，它将在完成滚动后启动滚动git，它将进入子项并开始滚动。

Answer 3

达到滚动限制时的操作取决于网络浏览器。

所以你描述的行为可能不同的浏览器。但他们大多选择继续滚动 next 可滚动元素...在个案中是页面文档。

以下是它的代码和演示：

<div class="one">
  <div class="two">
    <div class="three">
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
      <p>xxxxxx</p>
    </div>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
    <p>yyyyyy</p>
  </div>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
  <p>zzzzzz</p>
</div>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>
<p>aaaaaa</p>

Here is the JSFiddle demo

从最内层元素向下滚动。您会注意到，一旦到达下边缘，它就会滚动下一个可滚动的父元素。

jQuery网站的演示窗口滚动如何工作？

3 个答案: