When the page height is greater than the viewport height ArrowUp and ArrowDown are used to move the page up and down for a key board user.
Currently when the focus is on the slider handle ArrowUp and ArrowDown can have the unintended side effect of also scrolling the page as well as moving the handle.
By adding e.preventDefault only the handle will move, and the page will not scroll. Once the user tabs away from the slider the page can again be scrolled using the arrow keys.
When the page height is greater than the viewport height ArrowUp and ArrowDown are used to move the page up and down for a key board user.
Currently when the focus is on the slider handle ArrowUp and ArrowDown can have the unintended side effect of also scrolling the page as well as moving the handle.
By adding e.preventDefault only the handle will move, and the page will not scroll. Once the user tabs away from the slider the page can again be scrolled using the arrow keys.