simplify toc and remove post title from it
Highlight all sections on sight instead of last one to intersect
This commit is contained in:
parent
83cb7d2079
commit
8e0ba00192
|
@ -1,29 +1,13 @@
|
|||
function elementInToC(entry) {
|
||||
return document.querySelector(`#TableOfContents ul li a[href="#${entry.target.getAttribute('id')}"]`);
|
||||
}
|
||||
|
||||
window.addEventListener('DOMContentLoaded', () => {
|
||||
var previousActive = null;
|
||||
|
||||
const observer = new IntersectionObserver(entries => {
|
||||
var foundActive = false;
|
||||
entries.forEach(entry => {
|
||||
if (!foundActive && entry.isIntersecting) {
|
||||
if (previousActive) {
|
||||
previousActive.classList.remove('active');
|
||||
}
|
||||
elementInToC(entry).classList.add('active');
|
||||
foundActive = true;
|
||||
previousActive = elementInToC(entry);
|
||||
const id = entry.target.getAttribute('id');
|
||||
if (entry.intersectionRatio > 0) {
|
||||
document.querySelector(`#TableOfContents ul li a[href="#${id}"]`).classList.add('active');
|
||||
} else {
|
||||
document.querySelector(`#TableOfContents ul li a[href="#${id}"]`).classList.remove('active');
|
||||
}
|
||||
else {
|
||||
elementInToC(entry).classList.remove('active');
|
||||
}
|
||||
})
|
||||
|
||||
if (!foundActive) {
|
||||
previousActive.classList.add('active');
|
||||
};
|
||||
});
|
||||
});
|
||||
|
||||
// Track all headers that have an `id` applied
|
||||
|
@ -31,12 +15,3 @@ window.addEventListener('DOMContentLoaded', () => {
|
|||
observer.observe(section);
|
||||
});
|
||||
});
|
||||
|
||||
// Post title doesn't get parsed as it is not part of the content file
|
||||
(function addPostTitle2ToC() {
|
||||
var toc = document.getElementById('TableOfContents');
|
||||
if (!toc) return;
|
||||
var title = document.getElementById("post__title").innerText;
|
||||
var ul = toc.querySelector('ul');
|
||||
ul.outerHTML = `<ul><li><a href="#post__title" class="active">${title}</a>${ul.outerHTML}</li></ul>`;
|
||||
})();
|
||||
|
|
Loading…
Reference in New Issue