Dropdown Menu – is this possible?

Permalink
Hi all, I'm new to concrete5 and am looking for some advice before I commit to building a site using my current design (section attached).

I need to have a dropdown menu pop out of a vertical menu. The vertical menu features image style buttons with CSS rollovers on them. I would need a Superfish style menu to pop out from these image buttons.

I'm aware of the Superfish Dropdown Menu Add-On but can't see any others and I don't see any examples that suggest this would work in my case. Can anyone advise me on the best way of achieving this effect using concrete5.

Thanks for any help.
John

1 Attachment

 
TimDix replied on at Permalink Reply
TimDix
I don't have the superfish add-on, but I can tell you that this is definitely possible with a little bit of CSS / slight modifications to the auto-nav view.

Make sure your autonav is set to show all children and subpages.

The basic technique for any drop down menu is to first hide all nested ULs, and then show them when you're hovering over it's parent. then to position the drop down, you make sure to put position:relative on the li, and then position:absolute on the nested ul.

ul.nav ul {
   display:none;
}
ul.nav li {
   position:relative;
}
ul.nav li:hover ul {
   display: block;
   position: absolute;
   left:100%;
   top:0;
}


This will all work without any modifications to the code. If you want the top level LIs to be styled based on whether or not they have any children, then you need to do a little lookahead to check to see if there are any visible children, and if so, give it the appropriate class and style as desired.
DanK replied on at Permalink Best Answer Reply
Thanks Reverix, much appreciated. I'm not sure how to do that but I'll have a bash.

Cheers!