PDA

View Full Version : Layers in a Nav


egappleby
05-27-2005, 02:53 PM
Hi, this is my first post and it's long. Here's what I want to do...

nav description (zip - clean - of three gifs attached):
menu_main_over.gif
- illustrates resting, mouseover and onpage states
- resting is red/pink
- mouseover and onpage is purple
- second row of buttons (beginning with couvertures) is secondary nav

menu_sub_over.gif
- illustrates mouseover state of secondary nav item (black dots)

menu_sub_on.gif
- illustrates onpage state of secondary nav item (purple dots)

what i want to do:
1. ideally, make a single library item in dreamweaver that contains all nav elements in all states that will have the following behavior:
- when i mouseover each main nav element (eg. Mag) the element will swap to its correct mouseover color (purple) then change back to red when i mouseoff
- when i mouseover each main nav element (eg. Mag) the corresponding secondary nav bar/items will appear (eg. the bar including couvertures, articles, teasers, blagues, articles exclusifs)
- when i mouseoff Mag and mouseover the next nav item (eg. Media) the secondary nav bar will swap/be replaced by the next/corresponding secondary nav items (eg. Media has a whole different set of secondary nav items)
2. if it's not possible to make a single library item that contains all the main sections' secondary navs, i'd like to make library items for each of the main sections (i.e. Mag, Media, Santé, Communauté, Interactivité) and which exhibit the behaviors outlined above.

my comment/questions:
1. i know how to insert rollover images so changing the button states is not a problem.
2. i can use the show/hide layer behavior to get the subnavs to show up when and where i want them. but is this the best way to go about it? i've read all the stuff about older browsers having problems with the show/hide layer behavior, and if i'm faced with having to convert this to tables, i think that will throw a wrench in things, although i don't know for sure.
2. before i get into making library items, does anyone foresee any problems with doing that?

thanks for any help. this is the first site i've built...

egappleby
05-27-2005, 03:13 PM
me again. actually, i think i spoke too soon. i don't even know if i can get the layers to show/hide the way i want them to. i can do a basic: mouseover one button (i.e. Mag) and show the subnav; mouseoff and the subnav disappears. what i have not yet figured is how to make the subnav stay "shown" when i mouseover some of its elements, i.e. "couvertures". i want that secondary nav to stay visible, but it seems as though the mouseoff behavior takes priority.

thanks again...

ranjan
05-27-2005, 05:55 PM
http://www.dreamweaverclub.com/dreamweaver-dhtml-menu.php ('http://www.dreamweaverclub.com/dreamweaver-dhtml-menu.php')

egappleby
05-28-2005, 12:24 PM
hi, thanks for replying ranjan. i'm still stuck, however. i am able to get the subnav to show/hide when i want (i.e., when i mouseover the first button, the relevant subnav shows; when i mouseoff, its subnav hides. when i mouseover the next button, its relevant subnav shows; when i mouseoff, it hides.)

my problem now is that i don't know how to get the subnav to stay "shown" when i roll off its main nav button, and down onto the subnav itself. i understand why this is happening; after all, i've told the main nav button that upon mouseoff, it should hide the subnav so that if i am rolling onto another main nav button, that button's mouseover event can trigger it to show its relevant subnav.

so basically now i'm trying to figure out how to get the relevant subnavs to stay shown when the mouse is over: 1) the subnav itself, or 2) the relevant main nav button.

i hope this makes sense...

thanks again,
ega

ranjan
05-28-2005, 05:22 PM
please read the tutorial again, paying special attention to the part about "closer layer" in the tutorial, that will solve your problem

egappleby
05-29-2005, 01:03 PM
hi, thanks. yes, i did the tutorial and i did see that closer layer -- but i think what i'm up against is that i don't *really* understand why it works the way that it does. and, i'm going to have to teach someone how to make changes to this nav when i hand it over to him (after it's complete). so, not an ideal situation ("the blind leading the blind" comes to mind.)

in any case, i figured out how to make this work -- but i'm not using a closer layer. basically what i did is:

- for each "button" (item) in the subnav, i set an event to show that subnav layer upon mouseover.
- i did not set a hide event for anything.

and what's weird, is that everything is working. when i mouseover the main nav buttons, the relevant subnavs show up. when i mouseoff the main nav, and onto the subnav, it stays "shown."

i think i'm going to go with what i have working now, unless you foresee any problems with it.

thanks again,
ega

ranjan
05-29-2005, 03:58 PM
a better solution is that case (instead of each submenu link being set to show submenu layer) is the setTimeout javascript function, u can set a delay to hide the subnav.

http://www.devguru.com/Technologies/ecmasc...settimeout.html ('http://www.devguru.com/Technologies/ecmascript/quickref/win_settimeout.html')