Dropdown Boxes All Linked Together

Design help Animations & Interactions
1

Hello :slight_smile:

I made a custom dropdown carousel so I can put headings under images, then have the paragraphs in the drop down. All these images are in a big grid for product listings. All was good, until I tested it and when I click on one to drop down, all of them drop down at the same time, which kind of defeats the point. I imagine this is because they all have the same classes on, which is tied to the animation.

To disconnect them all, do i have to create individual classes for them all and change the ‘class effected’ on the animation, or is there a more efficient way to do it without having loads of different classes?

Thank you :slight_smile:

Please see ‘Medicines’ section - Webflow - Dragonfly Awakenings's Fantastic Site

Here is my public share link: LINK
(how to access public share link)

2

In your Accordion Open and Close animations, change the Accordion Item interactions to Affect the Interaction Trigger instead of the Class. You might need to right click the action and reclick the Accordion Item in the navigator to update this.
image

3

Awesome, thank you very much!

1 Like