Scroll sidebar to middle instead of top. (rust-lang#1161)

* Fix: Scroll sidebar to current active section (rust-lang#1067) * Clean: Some code related to PR rust-lang#1052 * Change `scrollIntoViewIfNeeded` with `scrollIntoView` * Don't use onload event for sidebar scroll to reduce flickering. Co-authored-by: 李鸿章 <[email protected]>
Ruin0x11 · Mar 24, 2020 · 9e77cb6 · 9e77cb6
1 parent 7947260
commit 9e77cb6
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 3 deletions.
diff --git a/src/theme/book.js b/src/theme/book.js
@@ -409,7 +409,6 @@ function playpen_text(playpen) {
 (function sidebar() {
     var html = document.querySelector("html");
     var sidebar = document.getElementById("sidebar");
-    var sidebarScrollBox = document.querySelector(".sidebar-scrollbox");
     var sidebarLinks = document.querySelectorAll('#sidebar a');
     var sidebarToggleButton = document.getElementById("sidebar-toggle");
     var sidebarResizeHandle = document.getElementById("sidebar-resize-handle");
@@ -508,7 +507,8 @@ function playpen_text(playpen) {
     // Scroll sidebar to current active section
     var activeSection = document.getElementById("sidebar").querySelector(".active");
     if (activeSection) {
-        sidebarScrollBox.scrollTop = activeSection.offsetTop;
+        // https://developer.mozilla.org/en-US/docs/Web/API/Element/scrollIntoView
+        activeSection.scrollIntoView({ block: 'center' });
     }
 })();
 

diff --git a/src/theme/index.hbs b/src/theme/index.hbs
@@ -87,7 +87,7 @@
         </script>
 
         <nav id="sidebar" class="sidebar" aria-label="Table of contents">
-            <div id="sidebar-scrollbox" class="sidebar-scrollbox">
+            <div class="sidebar-scrollbox">
                 {{#toc}}{{/toc}}
             </div>
             <div id="sidebar-resize-handle" class="sidebar-resize-handle"></div>