I have a header that has several top-level links like:
<li onmouseover="subNavMouseover('winSubNav');"
onmouseout="subNavMouseout();"><a href="/windows/" id="winMainNav">Windows</a>
<ul id="winSubNav" style="display: none;">
<li><a href="/windows/2003/">2003</a>
<a href="/windows/xp/">XP</a>
<a href="/windows/2000/">2000</a>
<a href="/windows/nt/">NT</a>
<a href="/windows/me-98-95/">ME/98/95</a>
<a href="/windows/">Windows-All</a></li>
</ul>
When the user mouse-overs each top-level LI it toggles javascript to show the
appropriate submenu (simply setting proper display: none/block values).
Everything works fine in IE and Firefox, and the toggle/display stuff works
fine in safari. However, the secondary LIs have an a:hover { color: #fff; }
which shows up properly in both IE and Moz. However, Safari doesn't display the
hover color. When you click a sublink the a:active color works fine, and if I
try setting an onmouseover="alert()" to the A element, it works fine. Safari
just won't recognize the a:hover element for the header.
I have noticed that it works fine if the menu is set to display: block
initially. If someone hovers over another top-level link and I use javascript
to set sub-level UL to style.display ="block", that's when the a:hover doesn't
work.
Any ideas why safari won't show a:hover in a UL set to display: block by
javascript?
Michael Botsko
Web Developer
503.227.2571 x230
AIM: botskonet
TechTracker, Inc
www.techtracker.com
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
