Streaming live at 10am (PST)

Show div and close other one

Hi everyone,

I’m stuck on something that is probably easy to do. I’d like to show a certain div (.modal-content) when a target (.modal-trigger) is clicked, hide the div related to the target when the user clicks another target, and show the div corresponding to the target.
This for the sticky section with this illustration.

There’s a tut on the forum but it was recorded during IX1, I couldn’t recreate it for IX2.


Here is my site Read-Only: https://preview.webflow.com/preview/alu-projets?utm_source=alu-projets&preview=0dbb75a07c4def7bb6af0ac59a870e41
(how to share your site Read-Only link)

The usual strategy is that the IX attached to the click does this:

  1. closes all the divs by targetting their common class (even if they’re already closed), so that you’re sure that the one opened is closing
  2. open the clicked one.
1 Like

Thanks vincent,
I had to fiddle with it a little bit. Had to create 3 interactions, 2 class-wide and another one specific for each trigger.

image

Have a good one! Bonne fin de journée