我正在尝试使用这个模块https://www.npmjs.com/package/react-scroll-parallax使react-scroll-parallax在一个div上起作用。
我试图设置视差提供程序,不仅指向body而且还指向特定的div。 我试图引用该元素(即scrollContainer)。
挑战是我在页脚和页眉之间使用了“滚动div”,所以在其上执行视差效果是行不通的。
我尝试创建一个引用,并将其引用到div上,但没有成功。
文档说要通过选项ref一个元素作为ScrollContainer: scrollContainer Element: 可选地设置具有溢出并包含视差元素的容器。 默认为HTML body
我试图设置视差提供程序,不仅指向body而且还指向特定的div。 我试图引用该元素(即scrollContainer)。
挑战是我在页脚和页眉之间使用了“滚动div”,所以在其上执行视差效果是行不通的。
我尝试创建一个引用,并将其引用到div上,但没有成功。
文档说要通过选项ref一个元素作为ScrollContainer: scrollContainer Element: 可选地设置具有溢出并包含视差元素的容器。 默认为HTML body
constructor(props) {
super(props);
this.myScrollDiv = React.createRef();
}
/////////////////
<ParallaxProvider scrollContainer={this.myScrollDiv.current}>
<div className="page-scroller site-wrapper pb-5" ref={this.myScrollDiv}>
///Content
</div>
</ParallaxProvider>
I would love for the .page-scroller div to handle parallax.