I have, and have used the suckerfish method before. The problem is
I've already created the CSS for the menus based upon them living each
in their own div, and would like to engineer them based upon that as
opposed to having to recode the CSS based upon another method.
Basically my HTML looks like this:
<div id="nav">
<ul>
<li class="main-nav"><a href="#" id="main-item-1">Main Item 1</a></
li>
<ul class="sub-nav-1">
<div id="menu1">
<!-- 4 col nav menu code goes here -->
</div>
</ul>
<li class="main-nav"><a href="#" id="main-item-2">Main Item 2</a></
li>
<ul class="sub-nav-2">
<div id="menu2">
<!-- 4 col nav menu code goes here -->
</div>
</ul>
<li class="main-nav"><a href="#" id="main-item-3">Main Item 3</a></
li>
<ul class="sub-nav-3">
<div id="menu3">
<!-- 4 col nav menu code goes here -->
</div>
</ul>
<li class="main-nav"><a href="#" id="main-item-4">Main Item 4</a></
li>
<ul class="sub-nav-4">
<div id="menu4">
<!-- 4 col nav menu code goes here -->
</div>
</ul>
<li class="main-nav"><a href="#" id="main-item-5">Main Item 5</a></
li>
<ul class="sub-nav-5">
<div id="menu5">
<!-- 4 col nav menu code goes here -->
</div>
</ul>
</ul>
</div>
When the user rolls over an item (main-item-#), I want to unhide the
sub-nav-# ul items, and the enclosed child div with it's 4 col menu
layout.
The issue I'm running in to is that using mouseover/mouseout activates
the menu, but when you move your mouse away from the main menu item,
the div disappears. I've tried attaching mouseover/mouseout actions to
the enclosing ul and divs, but those don't seem to register.
On Nov 25, 10:23 am, RyOnLife <[EMAIL PROTECTED]> wrote:
> Have you looked at the Son of Suckerfish
> method?http://htmldog.com/articles/suckerfish/dropdowns/
>
> Might be a good starting point to get everything working, then you can
> customize the CSS to get whatever look you're going for.
>
> On Nov 25, 10:07 am, serpicolugnut <[EMAIL PROTECTED]> wrote:
>
>
>
> > I'm trying to utilize jquery to construct a menu structure that is
> > similar to what you see at fox.com and nbc.com. Basically I have a
> > menu that is a ul list, with each li selector given it's own id. Below
> > I have a div container for each menu item, which are set to be hidden
> > by jquery upon load.
>
> > I've been the mousever/mouseout actions to trigger turning each div
> > container on/off, but the problems I'm encountering with this are 1)
> > it works when hovering over the main menu selection, but not when the
> > mouse is inside the div, making selecting sub items difficult/
> > impossible, and 2) for some reason in IE6/IE7, the divs don't show
> > when they are over a Flash object.
>
> > Does anybody have any ideas on how to take items #1 and #2?
> > --
> > View this message in
> > context:http://www.nabble.com/Using-jquery-to-construct-menus-like-nbc.com-tp...
> > Sent from the jQuery General Discussion mailing list archive at Nabble.com.
