Interaction experts, please help!
I have an interaction with the goal of two separate full screen overlays for viewing a contact form in the first overlay and map in the second overlay.
The triggers “Message” and “Visit” use their own unique interaction to trigger their respective overlays.
Each overlay has the following structure:
wrapping div
- close button
- overlay
– overlay content
The Close button in both wrapping div shares the same interaction, which targets itself and it’s sibling (overlay).
The interactions work ok independently, but when opening the Message overlay before the Visit overlay causes the close interaction to fail on the Visit overlay.
Here is my share link:
You can reveal the triggers by hovering over “Call or messsage us” green cta to the right of H1.
Here is my public share link: LINK