풋터 스크롤 움직임 추가
This commit is contained in:
@@ -5,12 +5,14 @@ import {
|
||||
FooterProps,
|
||||
FooterItemActiveKey
|
||||
} from '@/entities/common/model/types';
|
||||
import { useEffect, useState } from 'react';
|
||||
|
||||
export const FooterNavigation = ({
|
||||
setMenuOn,
|
||||
footerCurrentPage
|
||||
}: FooterProps) => {
|
||||
const { navigate } = useNavigate();
|
||||
const [isFooterOn, setIsFooterOn] = useState<boolean>(false);
|
||||
|
||||
const onClickToNavigate = (path?: string) => {
|
||||
if(!!path){
|
||||
@@ -91,11 +93,30 @@ export const FooterNavigation = ({
|
||||
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 (
|
||||
<>
|
||||
<nav className="bottom-tabbar">
|
||||
{ getFooterButtonItems() }
|
||||
</nav>
|
||||
{ isFooterOn &&
|
||||
<nav className="bottom-tabbar">
|
||||
{ getFooterButtonItems() }
|
||||
</nav>
|
||||
}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user