react-video-scroll icon indicating copy to clipboard operation
react-video-scroll copied to clipboard

Keeping video fixed

Open jskrt opened this issue 6 years ago • 3 comments

How can I style it so that i can make the video take up the whole screen and stay in one place while I scroll? Basically like the video rendering on the Oculus Go page.

I am trying to do this by modifying the example you provided in the README but I am having no luck.

jskrt avatar Jun 11 '18 19:06 jskrt

I know the example is not concrete in the README but that's why an API method exists for exactly this use case which is onLoad. Adjust your styles in this callback may be ?

nitin42 avatar Jun 11 '18 19:06 nitin42

The problem is that if I set the marginTop and marginBottom for the VideoScroll to be 0, I can't scroll through the video. There needs to be space to scroll in order to scroll the video but I cannot figure out how to keep the video in one place while I do it.

I'm guessing I need to use the onScroll function and dynamically update the marginTop and marginBottom while the user is scrolling so the video stays in one place?

jskrt avatar Jun 13 '18 17:06 jskrt

Yup! Exactly. You can adjust the styles using onScroll callback. I knew about this problem when I started working on this and thought that this might be one tradeoff but solved it simply by exposing callbacks (onScroll and onLoad). So with these two callbacks, I can adjust the video on page when it's loaded first and scrolled.

nitin42 avatar Jun 14 '18 14:06 nitin42