Streaming live at 10am (PST)

Background image swap on rollover


I am trying to build a site where the main navigation rolls over to view various background images similar to the way this site works:

Appreciate some help and instruction on how to do this.



To organize an HTML structure it is possible approximately so:

Live version:

Read-Only (see «Background image swap on rollover» Page):

Adjust background images in the Divs .nav-link-wrapper:
etc. :v:️:blush:


Hi, Thanks for your feedback. Could you give me a clearer instruction please, this doesn’t make any sense to me as I’m new to Webflow?


  1. Create two sections (.firs-section and .second-secion in my reference);

  2. Create an element what you need to paint, set him the background-color (white) e.g., set fixed position, z-index more than .firs- and .second- sections;

  3. Choose .second-section and create Scroll Into View Interraction with paint element (.white-black-element in my reference):
    When Scrolled Into View set: black Background color
    When Scrolled Out of View set: white Background color
    Offset is set ~88%

What does it mean you see at Webflow University:


Thank you. Much appreciated.