rythondev/RythonDev
1
0
Fork 0
mirror of https://github.com/liyunze-coding/RythonDev.git synced 2026-09-22 07:44:26 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

use scroll position instead of scroll progress for consistency

Browse source
This commit is contained in:
liyunze 2025-08-25 11:25:44 +10:00
parent 5b6933994b
commit b7d8c41884
2 changed files with 15 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
src/components/ui/NavigationBar.tsx
View file

@ -49,7 +49,7 @@ export const HoverNavigation = ({
className?: string;
}) => {
const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
const { scrollYProgress } = useScroll();
const { scrollY } = useScroll();
const [navVisible, setNavVisible] = useState(true);
const [availableVisible, setAvailableVisible] = useState(false);
@ -68,13 +68,13 @@ export const HoverNavigation = ({
const updateNavBarState = (
width: number,
scrollProgress: number = 0,
scrollPosition: number = 0,
scrollUp: boolean = false,
) => {
if (width && width < 1024) {
setNavVisible(false);
setAvailableVisible(true);
} else if (scrollProgress < 0.05) {
} else if (scrollPosition < 50) {
setNavVisible(true);
setAvailableVisible(false);
} else if (!onContactPage) {
@ -86,12 +86,12 @@ export const HoverNavigation = ({
}
};
useMotionValueEvent(scrollYProgress, "change", (current) => {
useMotionValueEvent(scrollY, "change", (current) => {
// Check if current is not undefined and is a number
if (typeof current === "number") {
let direction = current! - scrollYProgress.getPrevious()!;
let direction = current! - scrollY.getPrevious()!;
let scrollUp = direction <= 0;
let scrollProgress = scrollYProgress.get();
let scrollProgress = scrollY.get();
updateNavBarState(width, scrollProgress, scrollUp);
}

18
tsconfig.json
View file

@ -1,11 +1,11 @@
{
"extends": "astro/tsconfigs/strict",
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "react",
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
}
"extends": "astro/tsconfigs/strict",
"compilerOptions": {
"jsx": "react-jsx",
"jsxImportSource": "react",
"baseUrl": "./",
"paths": {
"@/*": ["src/*"]
}
}
}