I try to make a reverse navigation. I show the page from the bottom with scrollTo. I want reverse the wheel movement, when the whell movement is down the page goes to the top.
The body has a fix height so I use:
window.scrollTo(0, 2000);
I try to make a reverse navigation. I show the page from the bottom with scrollTo. I want reverse the wheel movement, when the whell movement is down the page goes to the top.
The body has a fix height so I use:
window.scrollTo(0, 2000);
Prevent the default wheel
event action and then programmatically do the exact reverse of it using window.scrollTo
method. Where use deltaX
and deltaY
to get scroll amount and scrollX
and scrollY
positithe on to get current scroll position.
document.getElementById('div').addEventListener('wheel', function(e) {
e.preventDefault()
window.scrollTo(window.scrollX - e.deltaX, window.scrollY - e.deltaY)
});
body {
height: 100vh;
}
#div {
height: 2000px;
overflow: auto;
}
<div id="div"></div>
window
object on Chrome, I see lot's of errors referencing to this, but your solution does work on any other element in the DOM, so this answer works
Commented
Apr 5, 2019 at 16:33