@ForSureN1
frontend dev

Как скроллить сайт до нужной секции по клику на элемент?

Добрый день. Мне нужно по клику на элемент в шапке, скролить до нужно секции, я решил не использовать id и т.п. Так как хочу чтобы такой код можно было использовать где угодно и вне зависимости от количества элементов.
Я уже получаю индекс элемента и индекс секции, но я не пойму как записать условие, которое будет скроллить.
let link = document.querySelectorAll('.item')
link.forEach((item, itemindex) => item.addEventListener('click', () => {
	let section = document.querySelectorAll('.section')
	section.forEach((section, sectionindex) => {
		console.log(section.getBoundingClientRect().top)
		if(itemindex === sectionindex) {
			
		}
	})
}))
  • Вопрос задан
  • 92 просмотра
Решения вопроса 2
Kozack
@Kozack Куратор тега JavaScript
Thinking about a11y
Ответ написан
Комментировать
@ForSureN1 Автор вопроса
frontend dev
Решил использовать данный метод
if(itemindex === sectionindex) {
			const height = section.getBoundingClientRect().top + window.pageYOffset - 78;
			window.scrollTo({top: height, behavior: 'smooth'});
		}

Так как позволяет отнять определенный уровень высоты, имея header с fixed позиционированием, закрывает часть контента, отняв высоту шапки, позволяет получить доступ к самому верху контента секции
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
19 апр. 2024, в 03:01
1000 руб./за проект
18 апр. 2024, в 21:56
2000 руб./за проект
18 апр. 2024, в 21:00
150 руб./за проект