Show div and close other one

ColibriMedia · April 24, 2019, 1:47pm

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)

vincent · April 24, 2019, 1:58pm

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

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
open the clicked one.

ColibriMedia · April 24, 2019, 3:12pm

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.

Have a good one! Bonne fin de journée

andy_saltyfruit · September 17, 2020, 3:53pm

Hello guys,

I’m kind of having the same issue with an interactive map that I’m building I’ve set up 2 interactions but the second interaction also seems to close the modal again.

I’m not sure as to why.

Heres the link to the site (map section)

https://preview.webflow.com/preview/castletown-law?utm_medium=preview_link&utm_source=designer&utm_content=castletown-law&preview=17dd95b93a550e1e0af080d3c93ca7a5&mode=preview

Any help would be much appreciated.

Andy

UXCentric · December 7, 2023, 6:42pm

How can I achieve the section in the webflow homepage depicted on image below? CMS or interactions? I need to create a list in which items trigger different GIF/Videos. Can you provide guidance?