JolinM
1
Hi, I’m trying to have a long menu, and have it stick in place when selecting an item (instead of resetting back at the beginning).
Not really sure how I should proceed; any thoughts?
Here’s the temporary website: http://www.louischarleslasnier.com/.
Thanks!
texnixe
2
Hm, maybe I’m too tired, but I don’t really understand how the title of this topic relates to your explanation below
?
JolinM
3
Nope, I am! My bad, I started from an old message!
Here is an example page with sticky sidebar navigation: https://thepaciellogroup.github.io/infusion/
They store the scroll position in local storage. Here is the relevant JS from their site:
/* persist navigation scroll point */
(function () {
window.onbeforeunload = function () {
var patternsNav = document.getElementById('patterns-nav');
if (patternsNav) {
var scrollPoint = patternsNav.scrollTop;
localStorage.setItem('scrollPoint', scrollPoint);
}
}
window.addEventListener('DOMContentLoaded', function () {
if (document.getElementById('patterns-nav')) {
if (window.location.href.indexOf('patterns/') !== -1) {
document.getElementById('patterns-nav').scrollTop = parseInt(localStorage.getItem('scrollPoint'));
} else {
document.getElementById('patterns-nav').scrollTop = 0;
}
}
})
}());