How to do dropdown always open?

Design help Animations & Interactions
1

Help please, i need to do the first service always open, and when i’m open the second service it will manually close service #1
https://preview.webflow.com/preview/accordion-custom-fb28fc?utm_source=accordion-custom-fb28fc&preview=8c71a9e0bcca67af59ae0fbf85c91365

1 Like
2

Hello @pzhydkykh

Not sure, but can you try using the script bellow.

<script>
$('.dropdown-class').trigger('tap');
</script>

Piter :webflow_heart:

3

no( that doesn’t work(

4

Maybe anything else can help me?

1 Like
5

Your class is named differently then the selector @PeterDimitrov shared with you. Change it to match the class name of your Dropdown. You may need to add an ID or additional class so you are only targeting the first item (or whichever you want the script to trigger on page load.

Take a look at this topic for the solution.

1 Like
6

Ou yes, I think the class needs to be

<script> 
$('.dropdown.always-open.w-dropdown').trigger('tap'); 
</script>
7

I’ve recreated this page on another and nothing changed
here is the website https://accordion-custom-2.webflow.io/

and here is the preview: https://preview.webflow.com/preview/accordion-custom-2?utm_source=accordion-custom-2&preview=33256e1153ee7013c3be00e17fcfab30

nothing changed( you can check the custome code field(

1 Like
8

Piter, maybe i do smth wrong? I pasted it into under body and in the head also, and there is no changes :confused:

1 Like
9

I’m not a code master :smile: Maybe I’m doing something wrong.

10

Webdev, can you please help, because neither that theme helped me( neither Piter don’t know how to do that. :confused:

11

Hey guys, can somebody help me, pls?

1 Like
12

Still looking for a solution, but can’t find it. I was trying to create a page load int, but I need to put more time.

13

i wrote to @samliew for some help, still waiting the answer

14

When I was testing a couple of workarounds, I looked deeper at your use case. In effect you are trying to use a dropdown menu as an accordion. I believe a custom accordion (using interactions) is a much more supportable solution for you. It would not be tied to potential issues if the dropdown menu core is updated or changed. No need for custom code. Also, the default behavior of a dropdown trigger is to change the z-index, which can cover content behind it. Not the case with an accordion.

There is a cloneable accordion (linked in the tutorial) that you could quickly modify to make it meet your needs.

15

Yeah, but it’s not exactly what i want to do because Dropdown has trigger “Open” and by this trigger i can change font size when necessary service is opened (it’s also necessary effect for me). When i will do custom dropdown i can do only “Scale” trigger which is not good for my case.
So the right decision for me is custom code with native dropdown menu, i think.

16

Look at this demo (offline for refactor).

17

Yeah, that’s great but the main aspect to do the first accordion always open, and when i’m open the second accordion it will manually close accordion #1
So, one of the accordions must be opened, while other are closed. And so on, while you open accordion 4, all other accordions must be closed.

18

webdev, could you please share this project?

19

Ok, as I read this you want to be able to have one of the dropdowns open first and the rest closed. So when you click on another dropdown that first will close and say #4 opens? Am I reading this correctly?

20

Yes, thats right, you understood correctly