DHTML Nav Menu

[duffster2004]

Hiya,

Ive seen a few threads but can't quite find what im looking for at the moment.....

Looking to create a drop down menu in the header that drops down and lists products.

Like that of the Horizontal CSS flyout menu....

Except I dont want it on a coluimn on the side of a page, want it dropping down from one of the menu buttons (OurProducts) etc.

I could make one from scratch maybe, but im not sure how to go about creating one that will already load all your categories an sub-categories in (like the left hand column CSS flyout one).

Basically, im rambling now, but is there one already made? I heard some talk of one, but I cant actually find it if it does. :-s

[kobra]

What you seek is the mod by DrByte. It has been a while since I have looked at this contribution but as I recall it covers both the side fly out and the top dropdown and is covered in the docs with the mod. At least that is what I recall.

As I do not know where the OurProducts menu is nor what it is, If you are using Zencart 1.3.x you could write your own in css. A good example can be found at the Suckerfish site: CSS Dropdowns

[cherylkemp]

I would like to work on a horizontal nav using this method also. Where would I upload the resulting css to make it work? Addition to the main stylesheet.css or it's on separate file in templates/custom? What do I need to add to zen to have it display?

Or...can I add custom links to the existing nav bar that has home, shopping cart, check out etc?

[cherylkemp]

doh...I just realized maybe ez pages header? except I want to use existing pages such as contact us, information, etc? Maybe use the ezpages internal link to indicate the existing page and mark the ez page to show in header?

[cherylkemp]

Answered at least part of my own question...got the header links working using ezpages. Now I just need more info on making the links a little more interesting with css or dhtml.

[cherylkemp]

Ok...after doing a lot of reading/searching on the forum, I'm still stuck. What I'd like to do is have the ezpages navigation menu look something like the example HERE

I think I've narrowed it down to styling in the main stylesheet #navEZPagesTop and doing something in tpl_header.php I'm not really sure though what goes where and if these are the only two file changes involved. Could someone please give me a better idea of what I need to do here to change the look of the ezpages navigation?

[kobra]

Cheryl,

Actually, since you have found the 'suckerfish' code sources, and I would think that you are capable of customizing this to your needs, all of this code could be represented in your css file, a separate css file for just this menu or possibly in your mainpage.php assuming the you want this menu on all pages.

[clydejones]

try adding this to your stylesheet.css (portion in red)

#navEZPagesTop {
background-color: #ffff33;
border-left: 15px solid #000000;
border-right: 15px solid #000000;
text-align: center;
}

[cherylkemp]

I think I got the customization part ok...you can see the nav in my test store at www.divaknitting.com/teststore

A couple of questions though..right now I have the code in templates/custom/templates/tpl_ezpages_bar_header.php and separated the css part into a file called stylesheet_ezpages_header.css in the custom/css folder Is that even how it should be set up?

Some how the right stylesheet is being used for the nav bar, but I have no idea how!
While the actual menu works, the styling part messes up the rest of the page. I'd also like the menu to be centered and haven't figured out how to do that yet.

A little more help please?

[kobra]

the style sheets are processed in alpha-numerical order . If you have defined separate class id's for te ezpage items they will not be applied to other items, but if you have replicated classes i.e. H1 or others the last sheet processed will prevail.

Your link wsa not functioning when I attempted access.

To attempt to center you might need to lock the position of the first and float the rest.

Will check for site access later