iframe - Internet Explorer修复了YouTube嵌入定位问题

Question

嗨，我正在尝试创建固定的100％宽度/高度的youtube嵌入，以便将鼠标悬停在屏幕底部下方时会显示div。现在，此功能可在Chrome，Firefox，Opera12，Opera15中使用，但不适用于IE10。请参阅下面的JSFiddle以了解我的意思。

http://jsfiddle.net/gQuRn/

以下是我的CSS

*{
    padding:0px;
    margin:0px;
}
body{
    width:100%;
    height:100%;

}

html{
    width:100%;
    height:100%;
}
iframe{
    position:fixed;
    top:0px;
    left:0px;
    z-index:0;
    height:100%;
    width:100%;
}

#bannercontainer{
    position:fixed;
    z-index:1;
    bottom:0px;
    left:0px;
    height:150px;
    width:100%;
    background:transparent;


}

#banner{
    width:70%;
    background-color:pink;
    height:150px;
    display:none;   
    margin:auto;
}

#bannercontainer:hover #banner{
    display:block;
}

Answer 1

IE10(甚至是IE)无法处理background:transparent;。您应该使用background:rgba(0,0,0,0)，它的工作原理相同。尽管较旧的浏览器(例如IE8)将不支持它。