看一下这个小小的演示:http://jsfiddle.net/TnzS4/
打开SELECT框,并将其悬停在下拉列表中。
在Chrome,FF,Safari和Opera中,该框为红色,表示:hover
状态仍处于活动状态。
在IE中,该框为灰色,表示:hover
状态处于非活动状态。
这是IE漏洞吗?
修改:请在您的IE版本中打开上述页面并报告(通过评论)是否有此行为。
答案 0 :(得分:1)
我不妨把它变成一个答案,因为我不能真正关闭它,因为它是一个完全有效的问题。正如安德鲁塞尔发现的那样,IE< = 7中似乎没有出现这个问题。我确认它不会发生在IE8中,然后我发现它不会发生在IE9平台预览版的最新版本中。因此,我认为我们可以将这一点归结为IE9测试版通道中的一个临时错误(尽管在最近一个版本发布时间近3个月之前很难将其称为“频道”)。
很好找,Šime。
编辑:我第一次看到这个问题时,我完全错过了关于你应该如何首先打开选择框的部分,然后将鼠标悬停在选项上。当发生这种情况时,似乎IE的所有版本(包括IE9的最新平台预览版)都不认为下面的div
处于:hover
状态。这完全取决于IE仍处理select
元素中的事件的方式。令人遗憾的事实是,没有纯粹的CSS方法来解决这个问题。您需要在JavaScript中操作事件。
坏消息是,这只会让你成为那里的一部分。考虑一下:
$('#wrap > select').focus(function() {
$('#wrap').addClass('wrap_hover');
}).blur(function() {
$('#wrap').removeClass('wrap_hover');
});
当您将鼠标悬停在:hover
元素上时,您不会丢失option
,但是当您鼠标移除:hover
时,您也不会丢弃#wrap
元件。如果这种行为对您来说是不可接受的,那么您将不会高兴地知道您必须在JS中测试IE,否则此代码将复制所有浏览器中的行为。
所以我认为这就是死胡同的样子。如果我是你,我要么忽略这个问题(如果有人抱怨我会告诉他们不要使用糟糕的浏览器)或者我会摆脱:hover
效果并找到另一种方法来达到目标您正试图实现的UI目标。
答案 1 :(得分:1)
我仍然看到这个问题。我正在使用IE 8,问题就出现了。 @treeface,你使用的是build 8.0.6001.18702吗? @Šime,你在IE8中看不到问题了吗?
我是最初将此引起Šime注意的人,因此,我想重新打开这个问题,或许找出为什么我的 Internet Explorer遇到此问题,而似乎没有其他人是?
所以真的,你们都没有这个问题吗?
根据我的IE开发人员栏,在浏览器模式下存在这个问题:IE8,IE7和IE8兼容性视图。还使用不同的文档模式(IE7标准,IE8标准,Quirks模式)进行了测试,但都给出了相同的错误。