Streaming live at 10am (PST)

How to create a pop up window


#1

Hi, I want to design a simple responsive popup/modal window. Basically when i click a button on the main page the window appears with an (X) at the top corner to close it. Are there any examples out there.

Thanks.


Here is my site Read-Only: LINK
(how to share your site Read-Only link)


#2

There sure are:

In very simple terms…

  • Create your modal as desired
  • Give it a z-index lower than the main page (or simply make it invisible)
  • Use Interactions on a button to then bring the modal forward (z) or make it visible
  • Use interactions to send it back again or make invisible when clicking ‘x’

More detailed explanations here in the legacy, and new versions of Webflow Interactions:

Let us know if you get stuck :slightly_smiling_face: