views:

216

answers:

4

is there any way to use "hover" attribute for all html elements instead of just '' in IE?

for example 'li:hover' . it doesn't work in IE6 . (i don't know about other versions of IE).

Edited: i just want to do it with CSS no javascript. it is a simple menu.

+4  A: 

No, IE6 didn't properly implement the :hover pseudo-class for all elements. It only supports it for anchors.

jeffamaphone
+2  A: 

Use onmouseover/onmouseout with javascript.

When you mouseover an element you simply show a hidden div with your hover contents.

When you mouseout of an element you will then hide the div with you hover contents.

Jquery makes this easier if you dont want to do all the leg work

<span id="hoverSpan" class="hoverelement" hoverdata="this is my hoverdata">HoverSpan</span>
<a href="#" id="hoverAnchor class="hoverelement" hoverdata="this is my hover data">HoverAnchor</a>
<div id="hoverdiv" style="display:none"></div>

<script language="javascript">
  $(document).ready(function () {
     $(".hoverelement").each( function () {
       var myelement = $(this);
       myelement.mouseover( function (e) {
         var myhovertext = myelement.attr("hoverdata");
         $("#hoverdiv").html(myhovertext).show();
       });
       myelement.mouseout( function (e) {
         $("#hoverdiv").html(myhovertext).hide();
       });
     });
  });
</script>

Its late and I did not test this, but the idea is there. Basically you would make a hover for any element with the class "hoverelement"

John Hartsock
thanks for your comment,but i don't want to use javascript. just with CSS .
hd
I do not believe it is possible with Just css. There are too many issues with different browsers/versions and the :Hover styles
John Hartsock
A: 

try jquery...i don't know exactly but it might work in IE6....

Nitz
+2  A: 

I don't think there is anyway that you can do it without javascript in IE 6.

If it is a one level menu, you might be able to tweak the styling to make the links render as display:block inside of the li so you can perform hovers on them, and if needed put spans inside the links for extra styling flexibility, but personally never had much luck trying to extend that to multi level menus.

A strategy of graceful degradation may be your best bet there.

seanb
ok,finally i use some snippet javascript code from http://www.xs4all.nl/~peterned/csshover.htmlas a csshover htc file to change behavior of body for IE.it seems living without Javascript is impossible !
hd