Files
frontend-svelte/src/shared/lib/utils/smoothScroll/smoothScroll.ts

33 lines
869 B
TypeScript

/**
* Smoothly scrolls to the target element when an anchor element is clicked.
* @param node - The anchor element to listen for clicks on.
*/
export function smoothScroll(node: HTMLAnchorElement) {
const handleClick = (event: MouseEvent) => {
event.preventDefault();
const hash = node.getAttribute('href');
if (!hash || hash === '#') return;
const targetElement = document.querySelector(hash);
if (targetElement) {
targetElement.scrollIntoView({
behavior: 'smooth',
block: 'start',
});
// Update URL hash without jumping
history.pushState(null, '', hash);
}
};
node.addEventListener('click', handleClick);
return {
destroy() {
node.removeEventListener('click', handleClick);
},
};
}