gregsaxton: yep, you know exactly what I want I'm trying to do - and that Survivor Magazine website + navigation menu is trés elegant ;
And I've been going back to that designchemical.com code all day actually, trying to figure out how to substitute the mega menu classes in there to make it work. But trying to make sense of -this stuff- is horrifying:
#megaMenu ul.megaMenu > li.menu-item,
#megaMenu ul li.ss-nav-menu-mega ul.sub-menu-1 > li > a,
#megaMenu ul li.ss-nav-menu-mega ul.sub-menu-1 > li:hover > a,
#megaMenu ul li.ss-nav-menu-mega ul ul.sub-menu .ss-nav-menu-header > a,
#megaMenu ul li.ss-nav-menu-mega ul.sub-menu-1 > li > span.um-anchoremulator,
#megaMenu ul li.ss-nav-menu-mega ul ul.sub-menu .ss-nav-menu-header > span.um-anchoremulator
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul.sub-menu-1 > li.menu-item
#megaMenu ul.megaMenu li.menu-item.ss-nav-menu-mega ul ul.sub-menu .ss-nav-menu-header
#megaMenu ul.megaMenu > li.menu-item.ss-nav-menu-item-depth-0 > a,
#megaMenu ul.megaMenu > li.menu-item.ss-nav-menu-item-depth-0 > span.um-anchoremulator
#megaMenu ul.megaMenu > li.menu-item > span.um-anchoremulator
#megaMenu ul.megaMenu > li.current-menu-item > a, #megaMenu ul.megaMenu > li.current-menu-parent > a, #megaMenu ul.megaMenu > li.current-menu-ancestor
#megaMenu ul.megaMenu > li:hover > a span.wpmega-link-title,
#megaMenu ul.megaMenu > li:hover > span.um-anchoremulator span.wpmega-link-title,
#megaMenu ul.megaMenu > li > a:hover span.wpmega-link-title,
#megaMenu ul.megaMenu > li > span.um-anchoremulator:hover span.wpmega-link-title,
#megaMenu ul.megaMenu > li.megaHover > a span.wpmega-link-title,
#megaMenu ul.megaMenu > li.megaHover > span.um-anchoremulator span.wpmega-link-title
...apparently I need to substitute the correct terms above, in the right places for these:
.menu li a
.menu li ul
.menu li ul li
.menu li ul li a
...but that's proving to be Very difficult to do without a Rosetta stone...and my usual strategy of "try all permutations until something happens" has been going n0where...
Also, I keep getting distracted by tantalizing prospective solutions involving some kind of jQuery and/or php code, like this: http://stackoverflow.com/questions/20998261/dont-toggleslide-div-if-other-div-is-expanded-slid-open
But unfortunately, nobody ever seems to mention where and how to implement these kinds of solutions :/
chappie: thank you for the inspiring response =P I feel like I was just getting warmed up, then I got derailed by the beguiling intricacies of of navigation system (which I feel is the vital key to framing all of the content to follow).
I actually tried to scrap the whole Ubermenu schtick earlier today, but a perverse iteration of my menu remained in the header even when I deleted all of my menus(!). Everything went back to normal after I re-created the existing Ubermenu navigation up now. Weird. Frustrating, also. Apparently I'm stuck with the horrors of Ubermenu's convoluted class codes...brrr!
The Enfold theme came with that nice Layerslider plugin...I played with it for a few days and scrapped some early efforts to get a feel for it. It's pretty flexible - in fact if it had a hover-active function for layers, I could've made a tight menu with it.
Thanks for pointing out that @media issue - I hadn't noticed that. I think the Search box color problem is in the theme styling, but I reckon I'd best see if I can make the menu function before I look into it - I'm *very* concerned about throwing out the whole menu over this rotten submenu current-menu-item-parent-thingy issue 0.o