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=winMainNavWindows/a
ul id=winSubNav style=display: none;
lia 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/