IE7 does not correctly process the ending of :hover
events when the mouse is positioned over an iframe.
An element which has been altered by a :hover
directive will remain altered as long as the user moves their mouse quickly enough over to an iframe element on the same page.
Test page Workaround is not included
Reported by: Darryl Dixon.
Explorer 7 | Reported on 10 November 2006.
This site is no longer maintained. I’m sorry, but it’s just too much work for too little return. You can continue to browse old bug reports, though.
Search reports by browser:
2 Posted by Nick Rowland on 26 January 2007 | Permalink
I had this issue on a site recently when adding some functionality, I worked around it by covering the iframe with a div and using onmouseover events to hide it when moving off the hover and another to show it when the hover was active.
It worked for me albeit a little crude
Thankfully I don't usually use iframes
3 Posted by Henning Krapoth on 9 February 2007 | Permalink
Found another workaround here:
http://archivist.incutio.com/viewlist/css-discuss/81588
Works for me.
1 Posted by STM on 24 January 2007 | Permalink
The IE7 :hover bug can be mitigated by placing a hidden div behind the element. Use javascript to make the div visible if the browser is IE 7. The div needs to be wider & higher than the element and must have a background-color. Add filter:(opacity=1) if you don't want the div to be seen.
The net result here is that when the mouse is moved from element it hits the div, which fires the mouseout event (removes the :hover alteration).
Remember to hide the div again on mouseout.