How sticky position works?

[LukeB (Luke Belcourt)]

Hi there,
I have went through a bunch of tutorials and walk-through videos regarding the sticky position but for some reason it just isn’t working on my design (https://agentfire.webflow.io/).

On my site here when you scroll down I am trying to have the image in the right column stick on scroll past each section.

I have the wrapper set to stick and the parent to the section that houses the three rows of content (which is set to relative). This is how all the tutorials have it setup as so not sure what I am missing.

Also I want the image to change once it hits each new row but I am assuming I can just fade in/out images using the interactions tool correct?

Any help would be much appreciated!

---

Here is my site Read-Only:
[1]: https://preview.webflow.com/preview/agentfire?utm_medium=preview_link&utm_source=designer&utm_content=agentfire&preview=96a6b2cfcb0169d17a8a8511e86fb03a&workflow=preview
[2]: Share a read-only link | Webflow University

[LukeB (Luke Belcourt)]

If anyone is having the same issue here is how Noel solved it for me.

Essentially set the image wrapper to be absolute, aligned top right, with a 100% height.
Then the “scrolling” image inside is set to sticky. Play with the top value or padding to get the alignment right.

[Stan (justAnotherDeveloper)]

Hi @LukeB if issue doesn’t persist feel free to close your request as solved

BTW: as many users have problems make sticky position to work there are many other solutions people can find when search this forum using right keywords beside your video from WF Support but thank you anyway.

[LukeB (Luke Belcourt)]

Ya but in the forum I couldnt find any solution for the specific issue I was dealing / trying to accomplish. So I figured I would post the video here for anyone else in the same situation.