An alternative to scrollIntoView()

The scrollIntoView() function with {behavior: 'smooth'} is not yet supported in Safari. Furthermore, if you use the {inline: 'center'} option, it's interrupted when you keep scrolling.

element.scroll() is an alternative to scrollIntoView() well supported by most browsers. Moreover, options.behavior is comptabile with Safari 14.

Let's assume that you have the following horizontal menu:

<div class = 'Menu'>
    <div id= 'A'>A</div>
    <div id= 'B'>B</div>
    <div id= 'C'>C</div>

To scroll to one of the items, you could do:

let Menu = document.querySelector('.Menu')
let B    = document.getElementById('B')

Menu.scroll({left: B.offsetLeft, behavior: 'smooth'})

Hi, I'm Erik, an engineer from Barcelona. If you like the post or have any comments, say hi.