Like the title says, I am trying to make my bottom navigation disappear when scrolling down, and reappear when scrolling up.
I tried following a tutorial about a top navigation, and thought I could mimic the results, and I tried to mimic an answer on here. Neither worked, it is not moving at all. Any help with this would be greatly appreciated, but I am VERY new to this, so feel free to explain it like I’m 5.
This was the code I tried:
html
<footer id="footer"><h1>Bottom of page<h1></footer>
css
footer {
position: fixed;
bottom: 0;
width: 100%;
height: 55px;
margin: auto;
align-items: center;
}
script
{
var(prevScrollpos) = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementById("footer").style.bottom = "-55px";
} else {
document.getElementById("footer").style.bottom = "0";
}
prevScrollpos = currentScrollPos;
}
}