Hover Pseudoclass For Anything in IE

2005-07-16 13:12 - Web

This is not my original work, but I wanted to make very sure I never lost it. Klaus Hartl posted this to the css-d discussion list on July 10th:

Hi all,

this may be of some interest here... I found a way to easily implement
whatever:hover using Dynamic Properties. Here's an example of the code:

EOMB:
..whatever {
     background: #808080;
}
..whatever:hover, .whateverhover {
     background: #eaeaea;
}

IE/Win:
..whatever {
     background-color: expression(this.runtimeStyle.backgroundColor,
this.onmouseover = function() { this.className += ' whateverhover'; },
this.onmouseout = function() { this.className =
this.className.replace('whateverhover', ''); });
}

It looks odd, but it works!

Here's a demo page:
http://stilbuero.de/demo/whatever_hover/
....and a blog entry of mine about all this:
http://stilbuero.de/blog/2005/07/whateverhover-fast-and-easy.html

Happy Coding,

Klaus

This is rather exciting. IE's total lack of support for things like :hover and min-width and so forth can now be made to function much better!

Comments:

No comments!

Post a comment:

Username
Password
  If you do not have an account to log in to yet, register your own account. You will not enter any personal info and need not supply an email address.
Subject:
Comment:

You may use Markdown syntax in the comment, but no HTML. Hints:

  • An empty line between text will create a paragraph boundary.
  • Use angle braces around a plain URL to auto-link it: <http://www.example.com/>.
  • Use this format to create a link with different text showing: [An Example](http://www.example.com/).
  • Use backticks (``), not leading spaces to enclose a code block.

If you are attempting to contact me, ask me a question, etc, please send me a message through the contact form rather than posting a comment here. Thank you. (If you post a comment anyway when it should be a message to me, I'll probably just delete your comment. I don't like clutter.)