14islands/r3f-scroll-rig

Infinite scolling feature from Lenis

Opened this issue · 3 comments

nhtoby311 commented

Is it possible to use Lenis infinite scroll feature, through this library, as an alternative to R3F's <ScrollControls infinite/>?

ffdead commented

You can configure Lenis this way:

<SmoothScrollbar config={{ infinite: true }} />

Haven't tested it myself, so depends how Lenis implements the infinite scroll. Let me know how it goes :)

nhtoby311 commented

I tried to replicate the <ScrollControls infinite/> from drei behavior, by creating a "virtual" scroll <div/>, so the DOM contents won't got affected while user scrolling the scroll bar.

However, it seems to not working well, as I bind the scroll to the custom "virtual" scroll structure, I still can get the data from useScrollbar(), but the scroll bar is not reactive to scroll. This does not happened on example where I don't bind the library in the custom "virtual" scroll.

I have created a minimal examples to describe the problems here: https://codesandbox.io/p/sandbox/clever-danilo-2txxkz?file=/src/App.tsx:15,28

ffdead commented

Thanks, unfortunately I don't have time to look into this right now. But thanks for the code sandbox, would be great if you can keep it alive for a while 🙏

  • 👍1