html - css下拉div在IE9中不起作用

Question

我有一个 div，当您将鼠标悬停时，会出现一个子 div 来显示信息。基本代码如下：

HTML

<div id="container">
    <div id="hidden_div">
        <iframe></iframe>
    </div>
</div>

CSS

#container {
    position: absolute;
    height: 20px;
    width: 40px;
    top: 8px;
    left: 30px;
}

#hidden_div {
    position: absolute;
    background: url(../_images/inside_btn_back.png) repeat;
    height: 60px;
    width: 350px;
    top: 0px;
    left: 0px;
    margin-top: 20px;
    z-index: 50;
    display: none;
    border: 1px solid #a08f89;
}

#container:hover #hidden_div, #container.over #hidden_div, #container:focus #hidden_div {
    display: block;
}

这适用于除 IE（特别是 IE9）以外的所有浏览器。我有一个使用相同方法的导航窗口，用于在 IE 中正常工作的下拉菜单。不知道为什么它不能与 div 一起使用。这是到此处的实时页面的链接。鼠标悬停在 div 上是页面底部附近的 facebook like 按钮。

Answer 1

它是在 iframe 中加载的页面没有透明背景导致悬停在 IE 中失败。