当悬停父元素不在ie时改变img src

Question

我有这个代码，我想在悬停鼠标父（Li）标签时，更改src img子标签... 这个代码在chrome中正确但在firefox＆amp;即不工作

<li class="player">
 .
 .
 //some code.......
 .
 .
  <table>
    <tr class="tr-msg">
      <td>
         <a>
            <img class="msg" src="../images/message-icon-h.png" />
         </a>
      </td>
    </tr>
  </table>
</li>

 <style>
   .player:hover .msg{
     content:url("../images/message-icon.png");
    }
 </style>

Answer 1

您调用了HTML代码中不存在的课程.liplay。将其更改为.player即可。

.player:hover .msg{
     content:url("../images/message-icon.png");
}

<强> Working Demo

修改

我建议使用background-image属性来实现您的目标。您可以将CSS更改为：

.player a{
    display:block;
    background-image: url("../images/message-icon-h.png");
    width:64px;
    height:64px;
    }

.player:hover > a{
    display:block;
    background-image: url("../images/message-icon.png");
    width:64px;
    height:64px;
}

另一个 demo fiddle

它在Chrome，FF，IE，Opera和Safari中工作。

Answer 2

我想你想做到这一点：

<style>

li.player:hover .msg
{
content:url("../images/message-icon.png");
}

</style>