Ok, let me ask this in a simpler way.
Why would safari recognize:
onmouseover="this.style.color='#fff'"
but not
a:hover {
color: #fff;
}
?
I've defined a:link, a:visited, a:active in the same css file before defining
the a:hover. The hover works perfectly in both Firefox and IE. The element sits
inside a UL/LI that is set to display: none when the page loads. If you hover
over a navigation menu, javascript sets the UL/LI to display: block.
If this same menu were set to display: block; when the page loaded, everything
would work fine. It seems that the javascript setting
document.getElementById("problemNav").style.display = "block" somehow prevents
safari from seeing the :hover. Remove the javascript and set it to display:
block, and it works.
Any ideas?
Michael Botsko
Web Developer
503.227.2571 x230
AIM: botskonet
TechTracker, Inc
www.techtracker.com
-----Original Message-----
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] Behalf Of Mike Botsko
Sent: Thursday, April 20, 2006 11:56 AM
To: CSS Discuss (E-mail)
Subject: Re: [css-d] Safari 2.0.3 doesn't see a:hover inside of LI
Updated:
The a:hover still won't show at all in Safari for me when the UL/LI the link
sits within was set to display: block by javascript. However, setting <a
onmouseover="this.style.color = '#fff'" works fine, but is more code than I
want and seems very unnecessary. I tried creating a test page for safari just
to make sure this isn't a bug, and it worked fine. It's something in my code
that somehow only affects safari.
Has anyone ever seen this? I don't see why safari will recognize the
onmouseover, but not the a:hover?
Michael Botsko
Web Developer
503.227.2571 x230
AIM: botskonet
TechTracker, Inc
www.techtracker.com
-----Original Message-----
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] Behalf Of Mike Botsko
Sent: Thursday, April 20, 2006 9:57 AM
To: CSS Discuss (E-mail)
Subject: [css-d] Safari 2.0.3 doesn't see a:hover inside of LI
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/
______________________________________________________________________
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/
______________________________________________________________________
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/
