Is there any way to make the accordion menu fully expanded by default?

Thanks

Comments

marcoka’s picture

marcoka CreditAttribution: marcoka commented

does not really make sense but i think you can override the css to achive this goal.

deggertsen’s picture

deggertsen CreditAttribution: deggertsen commented

It appears to be something that would need to happen in the javascript, I just can't find where.

My use case is to make a menu that shows by default, but can be hidden by the user if desired. So it has nothing to do with mobile as you would normally use the accordion menu for. Something similar to what the have on the left hand side of http://nike.com

marcoka’s picture

marcoka CreditAttribution: marcoka commented

well a quick idea may be to emulate a click on the button on load.

deggertsen’s picture

deggertsen CreditAttribution: deggertsen commented

That sounds like a good idea. But how do you do that?

Volker23’s picture

Volker23 CreditAttribution: Volker23 commented

I'd like this feature as well. The accordion is really great and if it would stay open all the time on desktop size it would be a killer. I'm developing a responsive site where an accordion-menu is requested for the big screens anyways. So it would be a nice feature to disable the toggle and the addClass('sf-expanded'), removeClass('sf-hidden')-stuff just for screensize bigger than the breakpoint.

Is this possible? Thanks!

geek.geek’s picture

geek.geek CreditAttribution: geek.geek commented

Hi,

Easy to achieve with plain CSS! just select the "Enable jQuery sf-Smallscreen plugin for this menu." and use this:

#block-superfish-1 .sf-accordion-toggle {
display:none;
}
#superfish-1-accordion {
left:auto !important;
top:auto !important;
}
deggertsen’s picture

deggertsen CreditAttribution: deggertsen commented

@geek.geek That was a great start for me. Thanks! I'll post what I had to put as yours didn't quite do it for me (when I first tried what you put it simply hid the menu so that it was no longer accessible at all...).

#block-superfish-1 .sf-accordion-toggle {
  display: none;
}
#superfish-1-accordion {
  left:auto !important;
  top:auto !important;
  display: block;
  position: relative;
}
Tsjippy’s picture

Tsjippy CreditAttribution: Tsjippy commented

In which css file did you put it?

I just created a new style.css file with only this text:
#block-superfish-1 .sf-accordion-toggle {
display: none;
}
#superfish-1-accordion {
left:auto !important;
top:auto !important;
display: block;
position: relative;
}

And I placed it in /public_html/sites/all/libraries/superfish/style.
Then I enabled the style, but that did not work.

Tsjippy’s picture

Tsjippy CreditAttribution: Tsjippy commented

Never mind, when using block2, it has to be superfish-2-accordion...

LOBsTerr’s picture

LOBsTerr CreditAttribution: LOBsTerr at European Commission and European Union Institutions, Agencies and Bodies commented
Status: Active » Closed (outdated)