CSS Dropdown menu for the header- With Categories!

[Zinfandel]

Hey chadderuski,

You may want to know that while I was deciding on which way to go, I had both the dropdown and the flyout menus going under IE6 at the same time and they both worked just fine.

And as for...

I noticed in IE6 (and probably IE5 as well) that there is a problem with the menu with pages that have a <select> active .... meaning the select box shows through the menu.

Atleast you're getting some answers, I posted a concern about that very same issue and might as well have spoken to my hand.

Thanks to you I got somewhat of a solution to think about.

I've been coding since 1982, COBOLII, CICS, DB2 SQL, all mainframe.
But I wouldn't know an object if it came from the orient.
During the last two years,I tried my hand in C#, Java, ASP, and now PHP. My brains are toast. I need help with the hard stuff, like adding a mod into my ZC without getting a headache.

Let's keep up this community orientation with a smile for as long as we can stand it. It's good for everybody.

[Get Em Fast]

I'm sorry you're feeling unloved Z. Hey, we're all "The Zen Family", and we love you......I would have tried to help......you know I would, if I hadn't been sick.
And as far as the Flyout Menu & the Dropdown menu working together......Oh, yea.....like ebony & ivory! At least in IE 7 (now IE 6 confirmed) & FF.

[chadderuski]

Hey Jade!

I have an idea to solve my LOOOOOOONG sub-categories problem (meaning a lot of mouse scrolling on the page).

What if we were able to set a max number of items to display in a fly out menu so that the scroll bar would attach itself to the side of that menu when it is too long??

I am thinking this would be doable by setting a height to the flyout menu somewhere in the css.

What do you think?

[jettrue]

Hey Jade!

I have an idea to solve my LOOOOOOONG sub-categories problem (meaning a lot of mouse scrolling on the page).

What if we were able to set a max number of items to display in a fly out menu so that the scroll bar would attach itself to the side of that menu when it is too long??

I am thinking this would be doable by setting a height to the flyout menu somewhere in the css.

What do you think?

I don't know that a css menu would make a scroll bar. Its just css. My advice to you would be to either try and condense categories more, or set it so that only the main categories drop down. To do that, simply open up includes/classes/categories_ul_generator.php and change $max_level to 1.

[chadderuski]

I don't know that a css menu would make a scroll bar. Its just css. My advice to you would be to either try and condense categories more, or set it so that only the main categories drop down. To do that, simply open up includes/classes/categories_ul_generator.php and change $max_level to 1.

Hi Jade! I worked on this a bit, and it is 'sort-of' possible:

div#dropMenu ul.level3, div#dropMenu ul.level4, div#dropMenu ul.level5 {top: 0; left: 12em; background:#4f4f4f;max-height:400px; overflow:auto}

by setting a max-height and overflow you get the scroll bar.

However, this only works on one sub-level, and they don't fly out... at least I haven't discovered a way to do that... once the scroll bar shows. It seems you can have one or the other but not both. The scroll bar kills the subsequent sub-menus.

Yes, I am condensing categories to make product depth more reasonable. I didn't supervise the initial data entry, so you can image the mess I inherited!

[Get Em Fast]

Hi Jade! I worked on this a bit, and it is 'sort-of' possible:

div#dropMenu ul.level3, div#dropMenu ul.level4, div#dropMenu ul.level5 {top: 0; left: 12em; background:#4f4f4f;max-height:400px; overflow:auto}

by setting a max-height and overflow you get the scroll bar.

However, this only works on one sub-level, and they don't fly out... at least I haven't discovered a way to do that... once the scroll bar shows. It seems you can have one or the other but not both. The scroll bar kills the subsequent sub-menus.

Yes, I am condensing categories to make product depth more reasonable. I didn't supervise the initial data entry, so you can image the mess I inherited!

You're right, Chad.......I've been working on this, also, as it seemed like a very good idea (especially after looking at your long list), and I've ran into the same problem.......it's EITHER flyout, OR scroll, but not both. gotta be a fix, though. Just haven't found it, yet.

[chadderuski]

Well, there are some java-based solutions, but that is a real departure from using a pure CSS design.

Jade's horizontal drop menu is GREAT! I have no complaints. But I like to fiddle and tweak. Will give the IFRAME solution a try when I can as this bug is evident even in firefox.

If you want a CHALLENGE, here you go!

Find a way to source-order the horizontal menu so that it lists AFTER the main page content, but displays at the top properly. Why do this? With a large number of categories and subcategories, the menu is quite large. This pushes the page content (what you want the spiders to read) way down on the page. Your page content may actually never be read, and <google> will likely punish you for all the duplicate (menu) content.

Ruthsarian discusses this here:

http://webhost.bridgew.edu/etribou/l...too/index.html

But even he doesn't treat the horizontal menu.... just the side menu.