Question

我有一个简单的悬停功能，可以使图像更加透明。我正在尝试在IE 11上使用该网站。奇怪的是，在某些计算机上，它的运行方式如何。在其他人也运行IE 11，它没有。我不知道这是代码问题还是仅仅是设置问题。有什么想法吗？

这是我的图片代码：

<img alt="Home" class="auto-style8" src="http://contoso/AzureTeam/Images/Home.png">

这是我的css：

.auto-style8 {

        width: 150px;
        height: 150px;
    }
 .auto-style8:hover {
         opacity: 0.4
    }

没有什么太花哨的了。我真的不明白什么是错的。

Answer 1

尝试使用css跨浏览器前缀

就像这样：

  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* Good browsers */
  opacity: 0.5;

Answer 2

您确定所有计算机都使用的是同一版本的IE 11吗？我有类似的问题。

您可以尝试通过这样做来覆盖所有基础：

 .auto-style8:hover {
     -webkit-opacity: 0.4;
     -khtml-opacity: 0.4;
     -moz-opacity: 0.4;
     -ms-opacity: 0.4;
     -o-opacity:0.4;
     -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
     filter: alpha(opacity=40);
 }

退房：http://www.w3schools.com/css/css_image_transparency.asp

Answer 3

关于CSS浏览器支持： Opacity属性适用于以下浏览器的版本。

<强>不透明度：

IE：9
Firefox：2
Chrome：4
Safari：3.1
Opera：9

也许在某些计算机上，IE版本早于9。

您应始终使用供应商前缀：

webkit-（Chrome，Safari，Opera的新版本。）
moz-（Firefox）
o-（旧版Opera）
ms-（Internet Explorer）

如果您可以访问代码不工作的计算机，您还可以测试删除该计算机的缓存。

按F12＆gt;网络＆gt; F5>右键单击＆gt;清除浏览器缓存

Answer 4

在IE6中：hover仅应用于具有href属性的元素。

在IE7中：将鼠标悬停在锚点以外的其他元素上通常会很慢。在大型桌子上，这可以证明几乎无法使用。修复是将位置相对（假设元素未定位）添加到正在悬停的元素。

在Internet Explorer版本8中，与z-index结合使用的元素的操作在与以下内容结合使用时会出现错误：hover

为什么悬停功能仅适用于某些计算机？

4 个答案: