Я пробую использовать JavaScript, но не могу правильно с этим справиться. этот свиток со всем телом.
моя страница такая
header/navbar
hero section
- Section 1
- Section 2
- Section 3
- Section 4
- Section 5
Я использую методы JavaScript, такие как — ScrollTo, ScrollBy, ScrollIntoView, но никто не может работать правильно
function showSection(sectionId) {
var targetSection = document.getElementById(sectionId);
var contentDiv = document.getElementById('content_div');
if (targetSection && contentDiv) {
var contentDivRect = contentDiv.getBoundingClientRect();
var sectionRect = targetSection.getBoundingClientRect();
var scrollPosition = sectionRect.top - contentDivRect.top + contentDiv.scrollTop;
window.scrollTo(0, scrollPosition);
}
}
Вот фрагмент:
function showSection(sectionId) {
var targetSection = document.getElementById(sectionId);
var contentDiv = document.getElementById('content_div');
if (targetSection && contentDiv) {
var contentDivRect = contentDiv.getBoundingClientRect();
var sectionRect = targetSection.getBoundingClientRect();
var scrollPosition = sectionRect.top - contentDivRect.top + contentDiv.scrollTop;
window.scrollTo(0, scrollPosition);
}
}
header/navbar
hero section
- Section 1
- Section 2
- Section 3
- Section 4
- Section 5
Я тоже пробую это-
function showSection(sectionId) {
var selectedSection = document.getElementById(sectionId);
if (selectedSection) {
const scrollOffset = targetElement.offsetTop - scrollableDiv.offsetTop;
scrollableDiv.scrollTop = scrollOffset;
selectedSection.scrollIntoView({ behavior: 'smooth' });
}
}
Подробнее здесь: https://stackoverflow.com/questions/784 ... javascript
Мобильная версия