How to set a sticky background image inside renderHeader?

[juand89]

I am trying to set a sticky background image inside render header, I used headerFixedTransformY but when I scroll the image will not stay fix. I need only the bg to stay fix all the time so when the user scroll the upper part of image will stay visible. Right now when I scroll the only the lower part of image will end up being visible. Any idea if it is possible to do this?

[z4o4z]

Hi @juand89, I think I don't understand right, do you have any examples?

[juand89]

Like this I want only the background Image to stay fix all the time and not to move even if I scroll. I try to change the style of the image to position absolute onHeaderFixed function but is not as smooth as I want to be:

[z4o4z]

@juand89 you can try to add parallaxBackgroundScrollSpeed={0.0001}, I think it can help...

[juand89]

thanks for the answer but the problem is that I'm using only the renderheader and isHeaderFixed={true}. I wonder if there is not an option like headerFixedTransformY for the parallaxBackground

[z4o4z]

You can try to use renderParallaxBackground to render background with the parallaxBackgroundScrollSpeed={0.0001} prop to disable background scrolling

[juand89]

You can close this issue, I could do it using setnativeprops.