laminbarrow.comRandom opinions on programming, web design and life |
Making a background image hover effect work properly in Internet Explorer 6Monday, February 04, 2008 Earlier today while i was working on a new menu style, i came across a weird bug in IE 6 wherein a background-image for a hover effect just would not disappear even when am not hovering over the link that was suppose to cause the effect. So after spending what seems to be like an hour trying to figure out what was causing the problem..... and finally i added background-repeat: repeat-x; in to my CSS file and that seems to have solved my problem. Before
After
.MenuSo it turns out that i must have background-repeat: repeat-x; in order to make that hover effect work properly in IE6. Very weird indeed. Your Comments There are 8 comments - add your comment Ted - Europe, World Tuesday, March 25, 2008 3:29 PM Your after CSS has hover.png in it twice. Good to know about the repeat-x though, thanks :-) laminb - Bakoteh, Gambia Wednesday, March 26, 2008 11:21 AM Hi Ted, I have just made changes to the article. Thanks for pointing that out to me. Good catch. RocA - Serrekunda, Gambia Monday, May 05, 2008 12:14 PM Good Point Lamin... it woulda take me days to figure out such issues...lol Anonymous - Georgia, United States Thursday, June 12, 2008 10:52 AM thank you so much I have been driving my self crazy trying to get the hover thing to work. My proablem was similar. The background images for me just wouldn't change on hover. I also didn't want the image to repeat but this seems to work also, and the image is already preloaded since the background-position is just changed.
#div{ background:url(image) 999px 999px repeat-x; } #div:hover{ background-position: 0% 15%; background-repeat: no-repeat; } bilgisayar - Africa, World Monday, June 16, 2008 11:46 PM css background examples , Properties , Attribute - - http://css-lessons.ucoz.com/background-css-examples.htm Ellen - Europe, World Friday, July 04, 2008 3:05 AM Hi I have exactly the same problem but this doesn't work for me. Would it be possible to see some of your HTML code? Thanks for the info Freddy - Venezuela, South America Friday, July 11, 2008 9:06 AM You just save my day... spend 2.5hour until i found this solution! Thanks man! laminb - Bakoteh, Gambia Saturday, July 12, 2008 4:16 AM @Ellen You can find the HTML code by viewing the source of this website. Hope this helps.
|
Related Topics Sponsored Links
|
|||||||||||