.scrollIntoView()

Метод scrollIntoView() позволяет программно прокрутить окно до определённого элемента.

Получаем элемент и накладываем метод scrollIntoView():

        
          
          const element = document.querySelector('#about')element.scrollIntoView()
          const element = document.querySelector('#about')

element.scrollIntoView()

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

🤖 В scrollIntoView() можно передать аргумент типа boolean:

• Если указать true, то скролл окна остановится у верхней границы элемента;
• Если указать false, то у нижней границы.

А ещё в scrollIntoView() можно передать объект с опциями скролла, где:

• behavior отвечает за анимацию прокрутки. Принимает smooth, чтобы было плавно, по умолчанию резкое auto;
• block за вертикальное выравнивание. Принимает start, center, end и nearest;
• inline за горизонтальное выравнивание. Принимает то же, что и block.

        
          
          element.scrollIntoView({behavior: "smooth", block: "center", inline: "start"})
          element.scrollIntoView({behavior: "smooth", block: "center", inline: "start"})

        
        
          
            
            Скопировать
            Скопировано
            Не удалось скопировать
          
        
      

Использовать scrollIntoView() полезно в случаях длинных веб-страниц, когда нужно прокрутить страницу к определённым частям, а использования ссылок с якорями недостаточно.