Sometimes need exact distance instead ratio

This commit is contained in:
Lim Chee Aun 2023-02-25 10:50:02 +08:00
parent 8fdc430dd5
commit aca3cb677b
2 changed files with 17 additions and 11 deletions

View file

@ -457,7 +457,7 @@ function StatusPage() {
const { nearReachStart } = useScroll({
scrollableElement: scrollableRef.current,
distanceFromStart: 0.2,
distanceFromStartPx: 16,
});
return (

View file

@ -7,6 +7,8 @@ export default function useScroll({
scrollThresholdStart = 10,
scrollThresholdEnd = 10,
direction = 'vertical',
distanceFromStartPx: _distanceFromStartPx,
distanceFromEndPx: _distanceFromEndPx,
} = {}) {
const [scrollDirection, setScrollDirection] = useState(null);
const [reachStart, setReachStart] = useState(false);
@ -38,16 +40,20 @@ export default function useScroll({
const scrollDimension = isVertical ? scrollHeight : scrollWidth;
const clientDimension = isVertical ? clientHeight : clientWidth;
const scrollDistance = Math.abs(scrollStart - previousScrollStart);
const distanceFromStartPx = Math.min(
clientDimension * distanceFromStart,
scrollDimension,
scrollStart,
);
const distanceFromEndPx = Math.min(
clientDimension * distanceFromEnd,
scrollDimension,
scrollDimension - scrollStart - clientDimension,
);
const distanceFromStartPx =
_distanceFromStartPx ||
Math.min(
clientDimension * distanceFromStart,
scrollDimension,
scrollStart,
);
const distanceFromEndPx =
_distanceFromEndPx ||
Math.min(
clientDimension * distanceFromEnd,
scrollDimension,
scrollDimension - scrollStart - clientDimension,
);
if (
scrollDistance >=