Avoid menu border flash during page navigation

Partially addresses #443
This commit is contained in:
Em Zhan 2023-06-17 21:40:39 -05:00
parent a204946d39
commit 1ef8d70ac4
2 changed files with 5 additions and 4 deletions

View File

@ -676,13 +676,14 @@ function playground_text(playground, hidden = true) {
}, { passive: true });
})();
(function controllBorder() {
menu.classList.remove('bordered');
document.addEventListener('scroll', function () {
function updateBorder() {
if (menu.offsetTop === 0) {
menu.classList.remove('bordered');
} else {
menu.classList.add('bordered');
}
}, { passive: true });
}
updateBorder();
document.addEventListener('scroll', updateBorder, { passive: true });
})();
})();

View File

@ -115,7 +115,7 @@
<div class="page">
{{> header}}
<div id="menu-bar-hover-placeholder"></div>
<div id="menu-bar" class="menu-bar sticky bordered">
<div id="menu-bar" class="menu-bar sticky">
<div class="left-buttons">
<button id="sidebar-toggle" class="icon-button" type="button" title="Toggle Table of Contents" aria-label="Toggle Table of Contents" aria-controls="sidebar">
<i class="fa fa-bars"></i>