Question

我在IE中有一个非常奇怪的不透明/悬停问题。一切都适用于FF和Chrome。

请考虑以下页面：

<!DOCTYPE html>
<html>
    <head>
    <title></title>
    <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#outer").css("opacity", .7);
        });
    </script>
    <style type="text/css">
        #outer
        {
            position: absolute;
            width:600px;
            background: #111;
            z-index:2;
            overflow: hidden;
        }
        #outer div
        {
            float: left;
        }
        ul
        {
            list-style: none;
            margin: 0;
            padding: 0;
        }
        ul li 
        {
            width: auto;
            margin: 2px 4px 2px 4px;
            padding: 2px 4px 2px 4px;
            font-size: 11px;
            color: White;
        }
        ul li:hover
        {
            background: red;
            font-weight: 600;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <div id="outer">
        <div id="one">
            <ul>
                <li>111</li>
                <li>222</li>
            </ul>
        </div>
        <div id="two">
            <ul>
                <li>333</li>
                <li>444</li>
            </ul>
        </div>
        <div id="three">
            <ul>
                <li>555</li>
                <li>666</li>
            </ul>
        </div>
    </div>
</body>
</html>

这是问题所在。鼠标悬停是间歇性的 - 您可能会或可能看不到IE中的红色背景和字体更改（7或8）。您将始终看到光标发生变化。如果我取出背景和字体粗细，我仍然会看到光标变化。但是如果有背景或字体粗细，光标仍然会改变，但背景或字体可能会也可能不会。

如果未在#outer上设置不透明度，则一切都可以使用。再次，FF和Chrome都很好。

您怎么看？

更新：此版本仅限于IE8。当IE8处于兼容模式（像IE7一样）时一切都很好！

但是，在标题中包含此标记：

<meta id="metaIE8IE7" http-equiv="X-UA-Compatible" content="IE=7" />

无法修复它。

Answer 1

遇到同样的问题并找到了解决方案（虽然我的解决方案是针对：悬停不是李：悬停而我没有测试过）

基本上，确保元素'has-layout'。例如，display：block等。然后重置该元素的透明度。 -ms-filter：“”;

Answer 2

得到了完美的工作组合：

display: block;
zoom: 1;
opacity:0.4; /*for ie9 and other browsers */
filter: alpha(opacity=40); /*for ie older browsers*/

正如鲍勃所说，'has-layout'对于它的工作至关重要，即8.在这里'display：block;'做到了。

Answer 3

对我来说更多的CSS货物崇拜！我不知道，但是将IE8引入IE7模式修复了这个问题。我错了，它没有在这个问题上工作。在其他浏览器中也很不错。

IE不透明度：有时悬停？

3 个答案: