Skip to content

Commit c515c77

Browse files
committed
js/docs: scroll TOC to active menu item
This helps keeping the currently selected menu item into view on pages that have many menu-items (such as the docker engine CLI reference) Signed-off-by: Sebastiaan van Stijn <github@gone.nl>
1 parent 86f2259 commit c515c77

1 file changed

Lines changed: 25 additions & 0 deletions

File tree

js/docs.js

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,6 +108,31 @@ function renderNav(docstoc) {
108108
element.innerHTML = outputHorzTabs.join("");
109109
});
110110
document.getElementById("jsTOCLeftNav").innerHTML = outputLetNav.join("");
111+
112+
// Scroll the current menu item into view. We actually pick the item *above*
113+
// the current item to give some headroom above
114+
scrollMenuItem("#jsTOCLeftNav a.currentPage")
115+
}
116+
117+
// Scroll the given menu item into view. We actually pick the item *above*
118+
// the current item to give some headroom above
119+
function scrollMenuItem(selector) {
120+
let item = document.querySelector(selector)
121+
if (item) {
122+
item = item.closest("li")
123+
}
124+
if (item) {
125+
item = item.previousElementSibling
126+
}
127+
if (item) {
128+
item.scrollIntoView(true)
129+
if (window.location.hash.length < 2) {
130+
// Scrolling the side-navigation may scroll the whole page as well
131+
// this is a dirty hack to scroll the main content back to the top
132+
// if we're not on a specific anchor
133+
document.querySelector("main.col-content").scrollIntoView(true)
134+
}
135+
}
111136
}
112137

113138
function highlightRightNav(heading) {

0 commit comments

Comments
 (0)