SEO friendly expandible menu -already using suckerfish for dropdowns

Hi all
Is there any seo friendly expandible menu available anywhere? I have a js one which I want to change. Thanks

If you’re looking for a pure CSS version, then this thread&highlight=pure+CSS+dropdown+menu) should help.

Thanks Tecno Bear that Paul O’B version is sick!! I don’t think it does the job for me though as I require a side navigation menu that when you click on collapses. Maybe this is only possible in js and I should just look at some different js (currently inherited a spry menu) that will allow menu to be crawled. I’ll carry on my search. :slight_smile:

though as I require a side navigation menu that when you click on collapses.

Generally any technique used for a horizontal menu can be used for a vertical menu.

Though you have a simpler option: let the entire menu show by default. Completely open if it’s not horrendously long. This way, users without Javascript (which of course includes search bots) have access to the entire menu. Make sure it’s visually obvious which parts of the menu are submenus and which parts are main menu items.

Then, simply have Javascript, onload, hide all the submenus, and let it show/rehide stuff like Javascripted menus usually do. This means the submenus are ONLY hidden for users with JS in the first place.

Otherwise, you might want to take a closer look at Deathshadow’s overflow:hidden version, because I think that can work quite well for an expanding vertical menu. That is what you’re going for, right? A vertical menu that, if you click on some main list item, the submenu appears directly underneath it, pushing the other main menu items further down?

Links for above (for those who haven’t read the thread listed in post #2):
Overflow:hidden menu demo
Overflow:hidden menu demo with scripting assist for keyboard

Thanks stommes pose - do you have any examples of the javascript-lite onload solution, that is exactly what I want, a “left hand navigation” not a “topnavigation”:

Otherwise, you might want to take a closer look at Deathshadow’s overflow:hidden version, because I think that can work quite well for an expanding vertical menu. That is what you’re going for, right? A vertical menu that, if you click on some main list item, the submenu appears directly underneath it, pushing the other main menu items further down?

Victorinox thanks that looks like a good solution but it is quite a job to make it work for a leftnav- are there any examples of it being used as a left nav? Cheers

are there any examples of it being used as a left nav? Cheers

If there aren’t, you could ask Crusty to make one.

I don’t use Javascript to hide/show menus, so I’m not familiar with the current scripts, but usually the script itself runs onload. Whatever the script is using to hide stuff (and if it’s using display: none to hide and :hover to show, you don’t want it, it’s not accessible— screen reader users tend to have Javascript enabled, but they won’t be :hovering over anything :slight_smile:

So a good script on a good menu will have maybe either the submenus absolutely positioned or use overflow: hidden like Crusty’s, and Javascript does little more than detect mouse and keyboard events and adds and removes classes, which have pre-defined styles in the CSS.

I’ll toss together a demo tomorrow between my cooking prepwork that uses the same method for a sideways menu instead of top… you’ll notice the second-level menu nest already does it, so it’s actually pretty simple to do.

Hi all
I found a good solution that uses minimal js here’s the link for anyone interested
http://www.456bereastreet.com/archive/200705/accessible_expanding_and_collapsing_menu/