Streaming live at 10am (PST)

A simple question for a Dropdown Menu


#1

Hello community smiley

I'm implementing a Dropdown for a catalog menu. But i want the "DropDown List" Start open, instead of close. If anyone know, please teachme.

Thaaaanks!


#2

The elements that drops down is the Dropdown list. The dropdown list has a property of display:none until you click the dropdown toggle. So as you can't "style" on the dropdown list element itself, you can't (I think) modify the dropdown widget for the list to be opened on the site load. I tried with interactions too but you can't target this object either because it's not one of your custom classes. oh wait...

Well you can. Select the Toggle, click open menu on the settings tab, give it a unique class. Create an interaction on it, targeting it, with initial state to display block. then select the Toggle again, add a new interaction, On click, first click display none, second click display block.

It's dirty but it works. It's here http://sab.webflow.com/opened-dropdown
Click on the green button in the menu to get the public link


#3

Hi @Jaime, @vincent made a great recommendation. I also made a demo that you can use if you want to check it out, with a slightly different approach.

Demo: https://webflow.com/design/demokit?preview=72388b288a26874be319ca1f7412d4eb
Page Title: Reverse Dropdown

I hope this helps! smile


#4

Hi, Vincent! I can't seem to make the dropdown list display on load using the instructions you provided in this post, and the demo link to your website doesn't seem to work anymore. Do you have a new link you can point me to? Thanks! Bill


#5

Can you kindly re-share your link, as it is not working. Thanks.


#6