IE不透明度:hover有时候? [英] IE opacity :hover sometimes?
问题描述
我在IE中有一个非常奇怪的不透明/悬浮问题。
I am having a very odd opacity/hover problem in IE. Everything works in FF and 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)。您将始终看到光标更改。如果我把背景和字体权重,我仍然看到光标的变化。但是如果背景或字体权重存在,光标仍然会改变,但背景或字体可能会也可能不会改变。
Here's the problem. The mouse-over is intermittent - you may or may not see a red background and font change in IE (7 or 8). You will always see the cursor change. If I take the background and font-weight out, I still see the cursor change. But if either the background or the font-weight are there, The cursor will still change but the background or font may or may not.
如果不透明度设置为 #outer
,一切无处不在。
If the opacity is NOT set on #outer
, everything works everywhere. Again, FF and Chrome are fine.
更新:
What do you think?
强>这种语言限制为IE8。当IE8处于兼容模式(像IE7一样)一切都很好!
UPDATE: This semes to be restricted to IE8. When IE8 is in compatability mode (acting like IE7) all is well!
但是,在标题中包含这个标签:
But, including this tag in header:
<meta id="metaIE8IE7" http-equiv="X-UA-Compatible" content="IE=7" />
不修复它。
推荐答案
遇到相同的问题,并找到了一个解决方案(虽然我的解决方案是:hover不是一个li:hover,我没有测试)
Had the same problem and found a solution (although my solution was for a:hover not an li:hover and I've not tested)
基本上,确保元素'has-layout'。例如,display:block等,然后重置该元素的透明度。 -ms-filter:;
Basically, make sure element 'has-layout'. For example, display:block, etc. Then reset transparency for that element. -ms-filter: "";
这篇关于IE不透明度:hover有时候?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!