feat: 添加 afterScroll 配置参数，在滚动结束后触发的回调函数

api/pug/fixed.pug

@@ -58,4 +58,7 @@ html(lang='en')
             $header.classList.add(HEADER_STICKY)
           }
         }
+        defaults.afterScroll = function(top) {
+          console.log('top', top)
+        }
         outline = new Outline(Outline.DEFAULTS)

api/pug/methods.pug

@@ -24,6 +24,8 @@ ul.aside__list
     a.aside__anchor(href="#option-homepage") homepage
   li.aside__item
     a.aside__anchor(href="#option-customClass") customClass
+  li.aside__item
+    a.aside__anchor(href="#option-afterScroll") afterScroll
   li.aside__item
     a.aside__anchor(href="#option-afterSticky") afterSticky
   li.aside__item

api/pug/options/afterScroll.pug

@@ -0,0 +1,52 @@
+section.section
+  header.section__header
+    h3#option-afterScroll.section__h3 afterScroll
+  div.section__content
+    h4.section__h4 Description
+    dl.section__dl
+      dt.section__dt Type：
+      dd.section__dd Function
+    dl.section__dl
+      dt.section__dt Default：
+      dd.section__dd null
+    p 可选，当点击导航菜单、文章中的 anchor 图标（#）或者上下滚动按钮会触发滚动，afterScroll() 回调函数会在滚动结束后触发执行。
+    h4.section__h4 Parameters
+    h5.section__h4 target
+    dl.section__dl
+      dt.section__dt Type：
+      dd.section__dd String
+    p afterScroll() 回调函数有一个参数 target，返回的是当前点击的 DOM 元素的名称：
+    ul
+      li 'anchor'：表示点击的是 anchor 图标，即文章中标题前的 “#” 图标，此时的 this 上下文指向 outline.anchors；
+      li 'chapter'：表示点击的是导航菜单的链接，此时的 this 上下文指向 outline.chapters；
+      li 'up'：表示点击的是工具栏的向上按钮，此时的 this 上下文指向 outline.toolbar；
+      li 'down'：表示点击的是工具栏的向下按钮，此时的 this 上下文指向 outline.toolbar；
+    p 注意：因为配置 afterScroll 回调函数会因为 4 个不同的 DOM 触发，所以需要根据 target 返回的值和此时的 this 指向判断处理。
+    pre.section__pre
+      code.section__code.
+        const defaults = Outline.DEFAULTS
+        let outline
+
+        defaults.position = 'fixed'
+        defaults.parentElement = '#aside'
+        defaults.stickyHeight = 86
+        defaults.homepage = './index.html'
+        defaults.afterScroll = function(target) {
+          // 当然，如果你希望无论是点击什么都执行，就不需要判断了
+          // 直接些通用的滚动结束的逻辑即可
+          switch(target){
+            case 'anchor':
+              // 针对点击 # 的处理逻辑
+              break
+            case 'chapter':
+              // 针对点击导航菜单的处理逻辑
+              break
+            case 'up':
+              // 针对点击向上滚动按钮的处理逻辑
+              break
+            case 'down':
+              // 针对点击向下滚动按钮的处理逻辑
+              break
+          }
+        }
+        outline = new Outline(Outline.DEFAULTS)

api/pug/options/section.pug

@@ -14,5 +14,6 @@ section.section
   include anchorURL
   include homepage
   include customClass
+  include afterScroll
   include afterSticky
   include afterToggle

docs/fixed.html

@@ -111,7 +111,32 @@
 new Outline({
   // 设置深色配置界面
   customClass: 'theme-dark'
-})</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterSticky">afterSticky</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，在设置 position: fixed 时，当导航菜单样式为 fixed 获取恢复为普通定位的时候，会触发执行 afterSticky 回调函数。</p><p>说明：afterSticky() 回调函数的 this 上下文执行 outline.chapters 对象。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">closed</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>closed 参数值为 true 表示菜单处于隐藏状态，否则表示菜单处于显示状态</p><h5 class="section__h4">isSticky</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>isSticky 参数值为 true 表示（position:fixed）菜单处于模拟 sticky 定位（position:fixed）状态，否则表示菜单处于普通状态。</p><pre class="section__pre"><code class="section__code">const $header = document.querySelector('#header')
+})</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterScroll">afterScroll</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，当点击导航菜单、文章中的 anchor 图标（#）或者上下滚动按钮会触发滚动，afterScroll() 回调函数会在滚动结束后触发执行。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">target</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">String</dd></dl><p>afterScroll() 回调函数有一个参数 target，返回的是当前点击的 DOM 元素的名称：</p><ul><li>'anchor'：表示点击的是 anchor 图标，即文章中标题前的 “#” 图标，此时的 this 上下文指向 outline.anchors；</li><li>'chapter'：表示点击的是导航菜单的链接，此时的 this 上下文指向 outline.chapters；</li><li>'up'：表示点击的是工具栏的向上按钮，此时的 this 上下文指向 outline.toolbar；</li><li>'down'：表示点击的是工具栏的向下按钮，此时的 this 上下文指向 outline.toolbar；</li></ul><p>注意：因为配置 afterScroll 回调函数会因为 4 个不同的 DOM 触发，所以需要根据 target 返回的值和此时的 this 指向判断处理。</p><pre class="section__pre"><code class="section__code">const defaults = Outline.DEFAULTS
+let outline
+
+defaults.position = 'fixed'
+defaults.parentElement = '#aside'
+defaults.stickyHeight = 86
+defaults.homepage = './index.html'
+defaults.afterScroll = function(target) {
+  // 当然，如果你希望无论是点击什么都执行，就不需要判断了
+  // 直接些通用的滚动结束的逻辑即可
+  switch(target){
+    case 'anchor':
+      // 针对点击 # 的处理逻辑
+      break
+    case 'chapter':
+      // 针对点击导航菜单的处理逻辑
+      break
+    case 'up':
+      // 针对点击向上滚动按钮的处理逻辑
+      break
+    case 'down':
+      // 针对点击向下滚动按钮的处理逻辑
+      break
+  }
+}
+outline = new Outline(Outline.DEFAULTS)</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterSticky">afterSticky</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，在设置 position: fixed 时，当导航菜单样式为 fixed 获取恢复为普通定位的时候，会触发执行 afterSticky 回调函数。</p><p>说明：afterSticky() 回调函数的 this 上下文执行 outline.chapters 对象。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">closed</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>closed 参数值为 true 表示菜单处于隐藏状态，否则表示菜单处于显示状态</p><h5 class="section__h4">isSticky</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>isSticky 参数值为 true 表示（position:fixed）菜单处于模拟 sticky 定位（position:fixed）状态，否则表示菜单处于普通状态。</p><pre class="section__pre"><code class="section__code">const $header = document.querySelector('#header')
 const HEADER_STICKY = 'header_sticky'
 const defaults = Outline.DEFAULTS
 let outline
@@ -825,4 +850,7 @@
     $header.classList.add(HEADER_STICKY)
   }
 }
+defaults.afterScroll = function(top) {
+  console.log('top', top)
+}
 outline = new Outline(Outline.DEFAULTS)</script></body></html>

docs/flex.html

@@ -117,7 +117,32 @@
 new Outline({
   // 设置深色配置界面
   customClass: 'theme-dark'
-})</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterSticky">afterSticky</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，在设置 position: fixed 时，当导航菜单样式为 fixed 获取恢复为普通定位的时候，会触发执行 afterSticky 回调函数。</p><p>说明：afterSticky() 回调函数的 this 上下文执行 outline.chapters 对象。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">closed</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>closed 参数值为 true 表示菜单处于隐藏状态，否则表示菜单处于显示状态</p><h5 class="section__h4">isSticky</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>isSticky 参数值为 true 表示（position:fixed）菜单处于模拟 sticky 定位（position:fixed）状态，否则表示菜单处于普通状态。</p><pre class="section__pre"><code class="section__code">const $header = document.querySelector('#header')
+})</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterScroll">afterScroll</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，当点击导航菜单、文章中的 anchor 图标（#）或者上下滚动按钮会触发滚动，afterScroll() 回调函数会在滚动结束后触发执行。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">target</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">String</dd></dl><p>afterScroll() 回调函数有一个参数 target，返回的是当前点击的 DOM 元素的名称：</p><ul><li>'anchor'：表示点击的是 anchor 图标，即文章中标题前的 “#” 图标，此时的 this 上下文指向 outline.anchors；</li><li>'chapter'：表示点击的是导航菜单的链接，此时的 this 上下文指向 outline.chapters；</li><li>'up'：表示点击的是工具栏的向上按钮，此时的 this 上下文指向 outline.toolbar；</li><li>'down'：表示点击的是工具栏的向下按钮，此时的 this 上下文指向 outline.toolbar；</li></ul><p>注意：因为配置 afterScroll 回调函数会因为 4 个不同的 DOM 触发，所以需要根据 target 返回的值和此时的 this 指向判断处理。</p><pre class="section__pre"><code class="section__code">const defaults = Outline.DEFAULTS
+let outline
+
+defaults.position = 'fixed'
+defaults.parentElement = '#aside'
+defaults.stickyHeight = 86
+defaults.homepage = './index.html'
+defaults.afterScroll = function(target) {
+  // 当然，如果你希望无论是点击什么都执行，就不需要判断了
+  // 直接些通用的滚动结束的逻辑即可
+  switch(target){
+    case 'anchor':
+      // 针对点击 # 的处理逻辑
+      break
+    case 'chapter':
+      // 针对点击导航菜单的处理逻辑
+      break
+    case 'up':
+      // 针对点击向上滚动按钮的处理逻辑
+      break
+    case 'down':
+      // 针对点击向下滚动按钮的处理逻辑
+      break
+  }
+}
+outline = new Outline(Outline.DEFAULTS)</code></pre></div></section><section class="section"><header class="section__header"><h3 class="section__h3" id="option-afterSticky">afterSticky</h3></header><div class="section__content"><h4 class="section__h4">Description</h4><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Function</dd></dl><dl class="section__dl"><dt class="section__dt">Default：</dt><dd class="section__dd">null</dd></dl><p>可选，在设置 position: fixed 时，当导航菜单样式为 fixed 获取恢复为普通定位的时候，会触发执行 afterSticky 回调函数。</p><p>说明：afterSticky() 回调函数的 this 上下文执行 outline.chapters 对象。</p><h4 class="section__h4">Parameters</h4><h5 class="section__h4">closed</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>closed 参数值为 true 表示菜单处于隐藏状态，否则表示菜单处于显示状态</p><h5 class="section__h4">isSticky</h5><dl class="section__dl"><dt class="section__dt">Type：</dt><dd class="section__dd">Boolean</dd></dl><p>isSticky 参数值为 true 表示（position:fixed）菜单处于模拟 sticky 定位（position:fixed）状态，否则表示菜单处于普通状态。</p><pre class="section__pre"><code class="section__code">const $header = document.querySelector('#header')
 const HEADER_STICKY = 'header_sticky'
 const defaults = Outline.DEFAULTS
 let outline