diff --git a/src/shared/ui/menu/index.tsx b/src/shared/ui/menu/index.tsx index e1596f4..d02f806 100644 --- a/src/shared/ui/menu/index.tsx +++ b/src/shared/ui/menu/index.tsx @@ -147,48 +147,30 @@ export const Menu = ({ const containerStyle = window.getComputedStyle(scrollRef.current); const paddingTop = parseFloat(containerStyle.paddingTop) || 0; const adjustedScrollTop = scrollTop + paddingTop; - const isScrollingUp = scrollTop < lastScrollTop.current; - if (isScrollingUp) { - // 스크롤 업: 화면 상단 기준으로 카테고리 선택 - const checkPoint = scrollTop + paddingTop + SCROLL_UP_OFFSET_PX; + // 뷰포트의 상단 기준점 (약간의 오프셋 추가) + const viewportTopWithOffset = adjustedScrollTop + 50; - for (let i = buttonRefs.current.length - 1; i >= 0; i--) { - const element = buttonRefs.current[i]; - if (!element) continue; + // 현재 뷰포트에 가장 많이 보이는 카테고리 찾기 + for (let i = 0; i < buttonRefs.current.length; i++) { + const element = buttonRefs.current[i]; + if (!element) continue; - const currentTop = element.offsetTop; + const currentTop = element.offsetTop; - if (checkPoint >= currentTop) { - if (i < buttonRefs.current.length - 1) { - const nextElement = buttonRefs.current[i + 1]; - if (nextElement && checkPoint >= nextElement.offsetTop) { - continue; - } - } + // 마지막 카테고리인 경우 + if (i === buttonRefs.current.length - 1) { + if (viewportTopWithOffset >= currentTop) { return i; } - } - } else { - // 스크롤 다운: 카테고리 시작점 기준 - for (let i = buttonRefs.current.length - 1; i >= 0; i--) { - const element = buttonRefs.current[i]; - if (!element) continue; + } else { + // 다음 카테고리가 있는 경우 + const nextElement = buttonRefs.current[i + 1]; + if (nextElement) { + const nextTop = nextElement.offsetTop; - const currentTop = element.offsetTop; - - if (adjustedScrollTop >= currentTop) { - if (i === buttonRefs.current.length - 1) { - return i; - } - - const nextElement = buttonRefs.current[i + 1]; - if (nextElement) { - const nextTop = nextElement.offsetTop; - if (adjustedScrollTop < nextTop) { - return i; - } - } else { + // 현재 카테고리 영역 내에 뷰포트 상단이 있으면 선택 + if (viewportTopWithOffset >= currentTop && viewportTopWithOffset < nextTop) { return i; } }