如何使用 framer-motion 检测特定的滚动位置?
How to detect certain scroll position with framer-motion?
当scrollTop等于500px时,我想在固定位置的div上触发动画。有没有办法在 framer-motion 中做到这一点。我只找到当元素在视口中时提出的解决方案。但是我的 div 一直在视口中,因为它有一个固定的位置。我需要一个内置的滚动位置观察器。
import { useInView } from "react-intersection-observer";
import { motion, useAnimation } from "framer-motion";
这已经有点老了,但这是答案。
import { useViewportScroll } from "framer-motion";
const Nav = () => {
const { scrollY } = useViewportScroll();
scrolly.onChange(y => {
// y = scroll position
//Do Something
})
}
const { scrollY } = useViewportScroll();
scrollY.onChange(y => {
console.log('y ', y)
})
只是一个小错别字:)
当scrollTop等于500px时,我想在固定位置的div上触发动画。有没有办法在 framer-motion 中做到这一点。我只找到当元素在视口中时提出的解决方案。但是我的 div 一直在视口中,因为它有一个固定的位置。我需要一个内置的滚动位置观察器。
import { useInView } from "react-intersection-observer";
import { motion, useAnimation } from "framer-motion";
这已经有点老了,但这是答案。
import { useViewportScroll } from "framer-motion";
const Nav = () => {
const { scrollY } = useViewportScroll();
scrolly.onChange(y => {
// y = scroll position
//Do Something
})
}
const { scrollY } = useViewportScroll();
scrollY.onChange(y => {
console.log('y ', y)
})
只是一个小错别字:)