풋터 스크롤 움직임 추가

This commit is contained in:
focp212@naver.com
2025-09-22 16:57:03 +09:00
parent 55424b11fb
commit ea9803d442

View File

@@ -5,12 +5,14 @@ import {
FooterProps, FooterProps,
FooterItemActiveKey FooterItemActiveKey
} from '@/entities/common/model/types'; } from '@/entities/common/model/types';
import { useEffect, useState } from 'react';
export const FooterNavigation = ({ export const FooterNavigation = ({
setMenuOn, setMenuOn,
footerCurrentPage footerCurrentPage
}: FooterProps) => { }: FooterProps) => {
const { navigate } = useNavigate(); const { navigate } = useNavigate();
const [isFooterOn, setIsFooterOn] = useState<boolean>(false);
const onClickToNavigate = (path?: string) => { const onClickToNavigate = (path?: string) => {
if(!!path){ if(!!path){
@@ -91,11 +93,30 @@ export const FooterNavigation = ({
return rs; return rs;
}; };
useEffect(() => {
const handleScroll = () => {
if(window.scrollY > window.outerHeight / 3){
setIsFooterOn(true);
}
else{
setIsFooterOn(false);
}
};
window.addEventListener('scroll', handleScroll);
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
return ( return (
<> <>
{ isFooterOn &&
<nav className="bottom-tabbar"> <nav className="bottom-tabbar">
{ getFooterButtonItems() } { getFooterButtonItems() }
</nav> </nav>
}
</> </>
); );
}; };