Quiero crear un efecto de paralaje (mover una imagen de fondo mientras se desplaza pero con un factor más lento).

Tengo un elemento div contenedor con desbordamiento automático y dentro de ese div tengo la imagen de fondo y también algo de contenido, contentHeight > imageHeight > wrapperDivHeight.

 <WrapperDiv with overflow auto> <Content ... /> <BackgroundImage with position absolute /> <WrapperDiv />

Mi formula para posicionar la imagen es la siguiente

 const imageTransformY = (100 * scrollY / (contentHeight - wrapperDivHeight) * (imageHeight - wrapperDivHeight) / imageHeight);

 scrollY -> the scroll position (y-axis) of WrapperDiv component contentHeight -> the height of Content component wrapperDivHeight -> the height of WrapperDiv component imageHeight -> the height of the BackgroundImage component imageTransformY -> css property to position the image

y está funcionando como se esperaba.

La cuestión es que quiero evitar usar contentHeight porque lo recupero del componente Content . En su lugar, me gustaría obtener el desplazamiento máximo posible del componente WrapperDiv y tal vez la altura de la barra de desplazamiento para calcular el contentHeight a partir de estos valores (contentHeight = maxScrollY + scrollHeight)

Es posible ? ¿Es esto posible con react-use ?