Accordion Apple Style, OnMouseOut collapse All

**ddadmin** · 08-11-2008, 05:41 AM

Hmmm everything looks right. As part of trying to visually see where the ".submenu" areas are, I saved a local copy of your page and gave that area an explicit background via CSS:

Code:

<style type="text/css">
.submenu{background: yellow}
</style>

I don't see this being applied to your expanded content area, however. Is there something in your CSS that's causing this?

**blueginko** · 08-11-2008, 04:55 PM

could be....okay to test this I threw the whole script on a page by itself. And then put back in the original CSS. It is something to do with the CSS.
I can't promise I'll get it figured out today (am battling flu) but will let you know when it's settled.

Thanks so (SOOOO) much for the quick responses and all the help. I'll let you know what it was that buggered the script. If you are interested the script is at http://www2.creighton.edu/testing/m-...yandstaff/one/.

Thanks again, I'll let you know

**Simmons** · 08-14-2008, 01:04 AM

Originally Posted by ddadmin

Ah yes. Try the below .js file then in place of what I posted above.

I've tried this and I have the same outcome as the first .js file: the menus collapse when the submenu is moused over:

http://dev.eller.arizona.edu/index_menu1.aspx

Thoughts?

Thanks much!

**ddadmin** · 08-14-2008, 06:25 AM

Wow this one's got me running around in circles. Ok, try the below .js file instead.

**Simmons** · 08-14-2008, 05:00 PM

Thanks much for the quick turnaround. Well, I have to say I'm not sure what's going on with it now. It seemed to work for the first three nav items, but not the next five, and then if I mouseover them again, it's back to the original behavior of not staying open at all. Or at least I don't see any consistency.

Perhaps it's something to do with the images I've inserted between the menuheaders?

**Simmons** · 08-14-2008, 05:04 PM

No, that doesn't seem to make a difference:

http://dev.eller.arizona.edu/index_menu2.aspx

I also toggled the persiststate to see if that makes a difference, but doesn't appear to. On the latest .js, the menu will both open on the mouseover and, next time moused over (or so it seems) close.

Any assistance is of course greatly appreciated.

**Simmons** · 08-14-2008, 09:49 PM

Also, a follow-up question:

Is it possible to trigger the closing/opening only on the text itself and not the full area or line?

Obviously I'm not much of a CSS expert, so perhaps that's an easy solution.

Thanks.

**blueginko** · 08-15-2008, 12:40 PM

For me I found it was the padding in

.applemenu div.submenu{
background: white;
padding: 2px;
height:165px;
}

to get it to match the buttons below it, I had it set to 0. That is what caused the content to collapse after the mouse moved off the header. Now why this would occur is beyond me, I did play with it a little and it indeed seemed to be the padding.