feat: auto hide empty article menu
This commit is contained in:
parent
aea2f30ffe
commit
8c1cde8fc9
|
@ -13,9 +13,15 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
function generateContent() {
|
function generateContent() {
|
||||||
var menu = document.querySelector(".post-menu .post-menu-content");
|
var menu = document.querySelector(".post-menu");
|
||||||
|
var menuContent = menu.querySelector(".post-menu-content");
|
||||||
var headings = document.querySelector(".post-content").querySelectorAll("h2, h3, h4, h5, h6");
|
var headings = document.querySelector(".post-content").querySelectorAll("h2, h3, h4, h5, h6");
|
||||||
|
|
||||||
|
// Hide menu when no headings
|
||||||
|
if (headings.length === 0) {
|
||||||
|
return menu.style.display = "none";
|
||||||
|
}
|
||||||
|
|
||||||
// Generate post menu
|
// Generate post menu
|
||||||
var menuHTML = '';
|
var menuHTML = '';
|
||||||
for (var i = 0; i < headings.length; i++) {
|
for (var i = 0; i < headings.length; i++) {
|
||||||
|
@ -25,14 +31,14 @@
|
||||||
+ '<a href="#h-' + h.getAttribute('id') + '">' + h.textContent + '</a></li>');
|
+ '<a href="#h-' + h.getAttribute('id') + '">' + h.textContent + '</a></li>');
|
||||||
}
|
}
|
||||||
|
|
||||||
menu.innerHTML = '<ul>' + menuHTML + '</ul>';
|
menuContent.innerHTML = '<ul>' + menuHTML + '</ul>';
|
||||||
|
|
||||||
// The header element
|
// The header element
|
||||||
var header = document.querySelector('header.site-header');
|
var header = document.querySelector('header.site-header');
|
||||||
|
|
||||||
// Active the menu item
|
// Active the menu item
|
||||||
window.addEventListener('scroll', function (event) {
|
window.addEventListener('scroll', function (event) {
|
||||||
var lastActive = menu.querySelector('.active');
|
var lastActive = menuContent.querySelector('.active');
|
||||||
var changed = true;
|
var changed = true;
|
||||||
for (var i = headings.length - 1; i >= 0; i--) {
|
for (var i = headings.length - 1; i >= 0; i--) {
|
||||||
var h = headings[i];
|
var h = headings[i];
|
||||||
|
@ -43,7 +49,7 @@
|
||||||
var headerHeight = headerTop + headerHeight + 20;
|
var headerHeight = headerTop + headerHeight + 20;
|
||||||
if (headingRect.top <= headerHeight) {
|
if (headingRect.top <= headerHeight) {
|
||||||
var id = 'h-' + h.getAttribute('id');
|
var id = 'h-' + h.getAttribute('id');
|
||||||
var curActive = menu.querySelector('a[href="#' + id + '"]');
|
var curActive = menuContent.querySelector('a[href="#' + id + '"]');
|
||||||
if (curActive) {
|
if (curActive) {
|
||||||
curActive.classList.add('active');
|
curActive.classList.add('active');
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue