메뉴 스크롤

This commit is contained in:
focp212@naver.com
2025-10-14 18:24:08 +09:00
parent 31478d1659
commit 85fb8cae49
3 changed files with 41 additions and 37 deletions

View File

@@ -136,3 +136,6 @@ main.home-main{
.pb-86{ .pb-86{
padding-bottom: 86px; padding-bottom: 86px;
} }
.bottom-tabbar{
transition: all 0.5s ease-out;
}

View File

@@ -42,18 +42,22 @@ export const Menu = ({
navigate(path); navigate(path);
}; };
const onClickToMenuNavigate = (menuId: string, index: number) => { const onClickToMenuNavigate = (menuId: string, index: number) => {
setShortBoxOnScroll(false);
setMenuListOnScroll(false);
let tops = [0, 255, 410, 565, 720, 875, 1030, 1500]; let tops = [0, 255, 410, 565, 720, 875, 1030, 1500];
let lefts = [0, 85, 170, 275, 360, 450, 450, 450];
setShortBtnIdx(index);
scrollRef.current?.scrollTo({ scrollRef.current?.scrollTo({
top: tops[index], top: tops[index],
left: 0, left: 0,
behavior: 'smooth' behavior: 'smooth'
}); });
/* shortBtnScrollRef.current?.scrollTo({
buttonRefs.current[index]?.scrollIntoView({ top: 0,
left: lefts[index],
behavior: 'smooth' behavior: 'smooth'
}); });
*/
}; };
const onClickToMenuClose = () => { const onClickToMenuClose = () => {
if(editMode){ if(editMode){
@@ -101,7 +105,7 @@ export const Menu = ({
}; };
const shortBtnScroll = (e: any) => { const shortBtnScroll = (e: any) => {
if(shortBoxOnScroll){
let x = shortBtnScrollRef.current?.scrollLeft; let x = shortBtnScrollRef.current?.scrollLeft;
let top = 0; let top = 0;
if(x){ if(x){
@@ -130,7 +134,7 @@ export const Menu = ({
setShortBtnIdx(5); setShortBtnIdx(5);
} }
} }
if(shortBoxOnScroll){
scrollRef.current?.scrollTo({ scrollRef.current?.scrollTo({
top: top, top: top,
left: 0, left: 0,
@@ -172,9 +176,6 @@ export const Menu = ({
behavior: 'smooth' behavior: 'smooth'
}); });
} }
/*
*/
}; };
const shortBoxTouchStart = () => { const shortBoxTouchStart = () => {
setShortBoxOnScroll(true); setShortBoxOnScroll(true);

View File

@@ -14,7 +14,7 @@ export const FooterNavigation = ({
setFavoriteEdit setFavoriteEdit
}: FooterProps) => { }: FooterProps) => {
const { navigate } = useNavigate(); const { navigate } = useNavigate();
const [isFooterOn, setIsFooterOn] = useState<boolean>(false); const [isFooterOn, setIsFooterOn] = useState<boolean>(true);
const onClickToNavigate = (path?: string) => { const onClickToNavigate = (path?: string) => {
if(!!path){ if(!!path){