IE6悬停状态无法恢复

发布于 2024-12-08 03:23:21 字数 505 浏览 0 评论 0原文

演示 http://people.mywot.com/dean/tour/ie6test.html

我已将这个问题缩小到上面的测试用例中。如果您在 IE6 中加载它,您会立即发现它。

问题

当鼠标悬停在 IE6 中的锚点上时,所有原本可见的后代元素都会变得可见,但一旦将鼠标悬停在锚点上,所有样式都会保留,但文本会消失。这会产生一个“幽灵盒”,并且产生非常有趣的(但不受欢迎的效果)。

今天早上我搜索了几个小时,试图找出这是哪个 IE6 bug,但我没主意了。

PS 忽略 PNG 的透明度。我只是没有在这个演示中包含 pngfix。

Demo
http://people.mywot.com/dean/tour/ie6test.html

I have narrowed down this problem into the test case above. You'll spot it right away if you load it up in IE6.

The problem

When hovering over the anchor in IE6, all descendent elements which are meant to become visible become visible, but as soon as you hover out, all styling remains but the text disappears. This results in a "ghost box" and quite an interesting (but undesired effect).

I've searched for a few hours this morning to try and find out which IE6 bug this is, but I'm out of ideas.

P.S. Ignore the transparency of the PNG's. I just haven't included the pngfix on this demo.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

鸩远一方 2024-12-15 03:23:21

不幸的是,IE6 中的悬停状态有一些愚蠢的错误。

http://reference.sitepoint.com/css/pseudoclass-hover 涵盖了其中的大部分这应该允许您尝试可能出现的错误。

编辑:不幸的是,您可能不得不求助于 javascript 来克服这一问题。

一些评论者忘记了有许多客户(例如:英国地方政府)仍然几乎只使用 IE6。遗憾的是我们这些仍然必须确保考虑到这一点的人!

Hover states in IE6 have some silly bugs unfortunately.

http://reference.sitepoint.com/css/pseudoclass-hover covers most of them which should allow you to experiment with what might be wrong.

EDIT: You may have to resort to javascript to overcome this one unfortunately.

Some commenters are forgetting that there are a number of clients (eg: UK local government) that still almost exclusively use IE6. Pity those of us who have to still ensure it is taken into consideration!

彩虹直至黑白 2024-12-15 03:23:21

是的,100%的站长都讨厌恶魔IE6,但我们是来回答问题的,不是来讨论IE6有多糟糕的,对吧?

对于这个问题,这是我的答案:(在演示代码中编辑了第 42 行和第 43 行)

...
    .screenshot a.bubble .description { position: absolute; min-width: 200px; bottom: -8px; background: none; display: none;
     }
    .screenshot a.bubble:hover .description { display: inline;  background: #efefef; }
...

我不知道如何操作,但是 IE6 无法隐藏未设置 css 属性“background”的 div到“无”。这就是导致问题的全部原因。无论如何,我讨厌IE6。

Yes, 100% of webmaster hate the devil IE6, but we're here to answer the question, not to discuss how bad IE6 is, right?

And for the question, this is my answer : (Edited line 42 & 43 in your demo code)

...
    .screenshot a.bubble .description { position: absolute; min-width: 200px; bottom: -8px; background: none; display: none;
     }
    .screenshot a.bubble:hover .description { display: inline;  background: #efefef; }
...

I don't know how, but IE6 cannot hide the div with css property "background" not set to "none". That's all what cause the problem. Anyway, I hate IE6.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文