I tried smooth-scrolling across a page with the click event and it works, also with CSS, but I tried it with keypress event but the smooth-scrolling doesn't seem to work. Here's my code-snippet;
<body>
<div class="first-section">
</div>
<div id="second-section" class="second-section">
</div>
</body>
document.addEventListener('keydown', function(e) {
if (e.key === "ArrowDown") {
document.querySelector('.second-section').scrollIntoView({
behavior: 'smooth'
});
}
})
Found the problem, had to add the
e.preventdefault();
method to prevent the default behavior which is a straight jump to the specified section. Then the smooth scroll will come into place.