How can I make my drop downs close when clicking another?

Hello,

I have some interactions on my dropdowns so they open and close smoothly when clicked but when you click more than one dropdown they stay open, how can I make it so when you click on another one the previous one closes?

here’s my site:
http://1251.webflow.io/

Preview link:
https://preview.webflow.com/preview/1251?preview=f234595407b6237030e19d7d1d8d1675

You need Javascript to do that easily. (Nice shadows btw). Or some nice hacking your way around with interactions.

You could use mouse-out interactions to close. But that would only get you PC.

As you’ve got many of those elements, it’s going to be a pain. But you could set a trigger to “close 1” + “close 2” etc. for all those boxed OnClick.
You could make 10 different interactions, “onclick, close #1”, “onclick, close #2” etc.
Then apply the 9 interactions to each of those boxes that it isn’t.
Get the idea?

Wouldn’t that only close the one above it then? What if someone chooses the second one and then decides to open the fourth one? Would this make the second one close?

Hey @Quantumgo

Try this to see if that will solve your problem:
http://webflowcodestutorials.webflow.io/click. Scroll down to Dropdown – Dropdown widget as an accordion.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.