Sticky div in viewport

Design help General
1

I want to keep a picture “sticky in the viewport” as I created with interactions in this http://ljbs.webflow.io/

(- a picture on the top

  • a picture on the bottom
    and a fixed picture that appears and disappears after scroll interactions).

Is it possible to create this effect with a single picture div and CSS only ?

2

Hi @bobmatthyssens, thanks for the question, from the description, it sounds like this should not be a problem to do in Webflow, however, it would help if you could share the read-only link also, so that we can see how the site is setup in the design view: Share a read-only link | Webflow University

Thanks in advance!

3

This is the share link :

https://preview.webflow.com/preview/ljbs?preview=0aec104b99dc188e4baf9c808f98228e .

But the question was not how to do it in Webflow but how to do it without JS (single picture div, css only).

4

Hi @bobmatthyssens, thanks for getting back to me, thanks, I am sorry if I misunderstood the question.

Take a look at our demo kit site: https://webflow.com/website/Demo-Kit

There is a page called Sticky Navigation, that shows how you can achieve a sticky navigation element effect using webflow. Probably would need to tinker with this a bit, but hopefully this helps.

5

This will not help… It’s only a part of what I made to show what I need… And it’s not CSS-only.

6

Hi @bobmatthyssens, sorry I misunderstood, I am not sure about doing this without interactions, but I am happy to keep checking.