鼠标悬停在IE7中不起作用？

Question

I have below HTML code.

<input type="button" class="myButton" value="Text"></input>

CSS

input.myButton{
    background: url("../images/button.png") no-repeat top left;
    height: 21px;
    cursor: pointer;
    width: 78px;
    text-align: center;
    color: #696969;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 11px;
    border: medium none white;
}
input.myButton:hover{
   background: url("../images/button-active.png") no-repeat top left;
   color: #FFFAF0;
}

But mouse hover is not working in IE7. I would like to change the image :hover .

How can i do this? it works fine in FireFox browser.

Thanks!

Answer 1

I think IE7 is so old hover doesn't work on anything but a . I remember this used to be a problem in IE.

You can write a workaround that uses an onmouseover/out listener that sets a class.

Answer 2

您最好使用jquery，因为IE中的CSS悬停支持因版本而异

Answer 3

在IE中，必须声明一个<!DOCTYPE> ，以便：hover选择器可以在<a>元素以外的其他元素上工作，这里： http : //www.w3schools.com/cssref/sel_hover.asp

Answer 4

The specification for IE7 is that the :hover pseudo class will only work on the a tag. You can get around this by using a polyfill. I would highly recommend Selectivizr . It allows you to use most pseudo classes on older, or unsupported, browsers.