Last active
August 31, 2022 15:29
-
-
Save diggeddy/0c2cea44e234cd3d620a93fdedb8788a to your computer and use it in GitHub Desktop.
Vanilla JS Sticky Nav Observer
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const stickyNav = document.querySelector('#site-navigation') | |
const mutateOptions = { | |
attributes: true | |
} | |
function callback(mutationList, observer) { | |
mutationList.forEach(function(mutation) { | |
if (mutation.type === 'attributes' && mutation.attributeName === 'id') { | |
// handle ID change | |
if (mutation.target.id == 'sticky-navigation') { | |
document.body.classList.add("nav-is-sticky") | |
} else { | |
document.body.classList.remove("nav-is-sticky") | |
} | |
} | |
}) | |
} | |
const observer = new MutationObserver(callback) | |
observer.observe(stickyNav, mutateOptions) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment