Ability to use viewport units about react-plx HOT 5 CLOSED

Cool, will try it out.
Thank you very much for the example 👍

from react-plx.

Hello @bogdansoare,
On the top of my head, you could just use widow.innerHeight (or innerWidth). So for example if you want for your effect to start on 120vh and to finish on 200vh you could pass options like this:

{
  start: window.innerHeight * 1.2,
  duration: window.innerHeight * 0.8,
  properties: [
    // ...
  ],
},

I think it is cleaner this way, as if I add support for vh units, I would need add conditional check, then parse it, and at the end do the exact same thing with window.innerHeight.

Hope it helps!

from react-plx.

Heelo @Stanko .
Thanks for the response. It's a good idea, the problem that I have with it is that I'm server rendering, and I don't have access to the window object.
Also I think there will be a problem when the window height changes.

from react-plx.

Plx already handles window resize.

As for the server rendering, you should handle it by passing SERVER_RENDER env variable, or just checking window type typeof window === 'undefined' and render Plx only in that case.

Naive example:

{ typeof window !== 'undefined' && <Plx /> }

or:

const isServer = typeof window === 'undefined';

<Plx 
   parallaxData={ isServer ? null : realParallaxData } 
/>

from react-plx.

@bogdansoare I'm going to close this one.

from react-plx.