CSS Dropdown menu for the header- With Categories!

TracNez411:

Hi JetTrue,

I'm ready to download your mod as all accounts seem to be great, but I wanted to confirm if it is tied to the admin panel to automatically load the categories/subcategories as they are edited, or if we'll need to go in and edit a separate file. Obviously, the categories won't change too much, but I'd love to hear that your menu automatically updates if a change is made in the admin panel.

TracNez411

As a user I can confirm for you that the menu will follow all changes you make to categories, subcategories, etc via the Admin panel, including additions, deletions and name changes. Enjoy it! :smile:

Maury

mauryg:

Do you think it would be possible to redo the CSS and maybe the template so that the subcategories (level 2 and lower) were listed in one or more horizontal rows rather than a vertical column?

Maury

that is not in my plans, but if someone else wants to figure out something like that, that would be great!

CES:

Try searching this thread for "lightbox".

Should sort out your problem. Let us know how you get on.

Craig

Craig,

since my problem was not with a lightbox but with HoverBox I located my hoverbox stylesheet and changed the z-index setting from 100 to 1000 so it now reads like this:

#hoverbox{
position: absolute;
left: 0;
width: 100%;
z-index: 1000;
text-align: center;
line-height: 0;
}

Thank you so much for your help! Worked like a charm. This forum is the best.

hi
how i can get rid of the gap betwen menu levels?
http://lifebaby.freehostia.com/gap.html

:frusty::frusty::frusty:
HELP ME PLEASE
Thanks you!

Can we see a link to your store or the contents of your css file?

Craig

**
http://lifeconstruct.freehostia.com**

and this is the stylesheet_header
body {
behavior: url(includes/csshover.htc);
}

/green/
div#dropMenu li a:hover, div#dropMenu li.submenu li.submenu:hover {color: #4f4f4f!important;background:#D5E88F;}

div#dropMenu {
width:100%;
margin:0 auto;
text-align:center;
z-index:1000;
position:relative;
}

div#dropMenu ul {
margin:0;
padding:0;
}

div#dropMenu li {
position:relative;
list-style:none;
margin:0;
float:left;
line-height:1em;
width:16.667%;
}

div#dropMenu ul.level1 {
width:100%;
margin:0 auto;
text-align:center;
background:#4f4f4f;
z-index:1000;
float:left;
}

div#dropMenu li:hover {}
/*div#dropMenu li.submenu {background: url(../images/dropmenu.gif) 95% 50% no-repeat;} */
div#dropMenu li.submenu:hover {}
div#dropMenu li a {display: block; padding: .6em 0;text-decoration: none; text-transform:uppercase; color:#ffffff; text-align:center; border-right:1px solid #ffffff;}
div#dropMenu li a.noLine {border:none;}
div#dropMenu>ul a {width: auto;z-index:1000;}
div#dropMenu ul ul {position: absolute; width: 8em;display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:8em;z-index:1000;}
/*div#dropMenu li.submenu li.submenu {background: url(../images/submenu.gif) 95% 50% no-repeat;} /
div#dropMenu ul.level1 li.submenu:hover ul.level2,
div#dropMenu ul.level2 li.submenu:hover ul.level3,
div#dropMenu ul.level3 li.submenu:hover ul.level4,
div#dropMenu ul.level4 li.submenu:hover ul.level5,
div#dropMenu ul.level5 li.submenu:hover ul.level6,
div#dropMenu ul.level6 li.submenu:hover ul.level7,
div#dropMenu ul.level7 li.submenu:hover ul.level8 {display:block;z-index:1000;}
div#dropMenu ul.level2 {background:#4f4f4f;z-index:1000;position:absolute;left:0;}
div#dropMenu ul.level3,
div#dropMenu ul.level4,
div#dropMenu ul.level5,
div#dropMenu ul.level6,
div#dropMenu ul.level7,
div#dropMenu ul.level8{top: 0; left: 12em; background:#4f4f4f}
div#dropMenu ul.level2 a {padding: 0.5em 0 0.5em 0.25em;color: white; text-transform:none;} / this is text color on drop-down submenu */
div#dropMenu ul.level2 a:hover {color:#4f4f4f;}

thank you!!!!

how would i go about adding the other menu as shown at http://makeupconnection.com where it says specals featured whats new show all, and home login help community? i have read through about 30 pages and gave up lol, sorry. i wasnt sure if these were mods availale for download, or if the code is posted somewhere here. any help would be great!

crinolina:

**
http://lifeconstruct.freehostia.com**

div#dropMenu ul ul {position: absolute; width: 8em;display: none;}
div#dropMenu ul ul li {border-bottom: 1px solid #CCC; width:8em;z-index:1000;}
div#dropMenu ul.level8{top: 0; left: 12em; background:#4f4f4f}

You have two '8em' and one '12em' in the above lines.

Make them all them same (8 or 12). I use 12em.

Let us know how you get on.

Craig

mundi:

how would i go about adding the other menu as shown at http://makeupconnection.com where it says specals featured whats new show all, and home login help community? i have read through about 30 pages and gave up lol, sorry. i wasnt sure if these were mods availale for download, or if the code is posted somewhere here. any help would be great!

I do believe that site uses this 'similar (Paul's Edition)' drop down menu for the products:
http://www.zen-cart.com/index.php?main_page=product_contrib_info&products_id=523

I do not know about the links you describe above.

I presume it is a bespoke design of the header.

You could try contacting TooLateSmart.

Craig

mundi:

how would i go about adding the other menu as shown at http://makeupconnection.com where it says specals featured whats new show all, and home login help community? i have read through about 30 pages and gave up lol, sorry. i wasnt sure if these were mods availale for download, or if the code is posted somewhere here. any help would be great!

Yes, that site is using the "Paul's Edition", where the categories are shown in the drop down menu, with each category being a drop down. As far as the specials and such, that is not part of the mod, and something he added on his own.

i have pm'd him to see if i can get an answer, would anyone know how to accomplish this look, maybe it is using javascript?(should i start another thread since it has nothing to do with this mod?)

i still have recieved no answer from him, so im not sure i will, but i used firefox to get a bunch of jscript from that site, if i put it up here, will you great people be able to help me figure out what other files i have to add, edit to get it to look somewhat similar?

mundi:

i still have recieved no answer from him, so im not sure i will, but i used firefox to get a bunch of jscript from that site, if i put it up here, will you great people be able to help me figure out what other files i have to add, edit to get it to look somewhat similar?

Sorry, I don't have to time to set that up, you are also requiring images to get that done.

I have been experiencing a minor problem with main page text showing up in its entirity above the Category page. I dont know how long this has been going on but the only mods I have done are css horizontal menu and FAQ module.

Its not a big deal but it could discourage customers from scrolling down to the bottom of the page to see the sub categories.

Can anyone tell me if its related to the dropdown menu.

pixelpadre:

I have been experiencing a minor problem with main page text showing up in its entirity above the Category page. I dont know how long this has been going on but the only mods I have done are css horizontal menu and FAQ module.

Its not a big deal but it could discourage customers from scrolling down to the bottom of the page to see the sub categories.

Can anyone tell me if its related to the dropdown menu.

Could I see a link to your site?

Scanmyid

pixelpadre:

Scanmyid

LOL, thanks for the link and full sentence there.

I took a look at your site, but I'm not comprehending your problem. Can you send a link of a page with the problem with a more detailed description, along with which browser you are using?

Thanks!

ETA: Someone else had this issue, it is the FAQ module.

jettrue:

LOL, thanks for the link and full sentence there.

I took a look at your site, but I'm not comprehending your problem. Can you send a link of a page with the problem with a more detailed description, along with which browser you are using?

Thanks!

ETA: Someone else had this issue, it is the FAQ module.

Ok..it used to be that I would go to the main page and see my blah blah blah. Then if you cllicked on a categorie on the left that had 2 sub categaories.....a new blank page would open with two subcategory icons with links.

Now....if you click on the category the main text page is regenerated with the two subcategory icons way down on the bottom after the text which should not be there.

What is "ETA: Someone else had this issue, it is the FAQ module"?

pixelpadre:

Ok..it used to be that I would go to the main page and see my blah blah blah. Then if you cllicked on a categorie on the left that had 2 sub categaories.....a new blank page would open with two subcategory icons with links.

Now....if you click on the category the main text page is regenerated with the two subcategory icons way down on the bottom after the text which should not be there.

What is "ETA: Someone else had this issue, it is the FAQ module"?

If you remove the FAQ module the problem will probably go away. I don't know WHAT the issue is, I just know someone had the same issue, and it was the FAQ module. I don't know the solution, sorry!

:blink: Hello. I recently installed this wonderful dropdown menu (v1.4). I uploaded all the files following the instruction. But when I checked with W3C CSS validator and found the following error:

URI : http://bioland-sci.com/includes/templates/CUSTOM/css/
stylesheet_header_menu.css

2 body Property behavior doesn't exist : url(includes/csshover.htc)

Could anybody tell me if it could be corrected? Thanks in advance.