Internet explorer 8 如何点击一个位置：固定；身高：100%；宽度：在IE8中100%覆盖？_Internet Explorer 8

Internet explorer 8 如何点击一个位置：固定；身高：100%；宽度：在IE8中100%覆盖？

internet-explorer-8

Internet explorer 8 如何点击一个位置：固定；身高：100%；宽度：在IE8中100%覆盖？,internet-explorer-8,Internet Explorer 8,我有一个错误，我正试图缩小范围，它被证明是一个doozie。我正在制作一个模式叠加，在IE8中，出于某种原因，我可以单击“通过”，聚焦输入并选择它下面的文本在IE9、FF、Chrome中，一切都按预期工作。不幸的是，我设计的简化测试用例（如下所示）在IE8中运行良好。以前有人遇到过这个错误吗？希望节省一些时间。谢谢 <!DOCTYPE html> <html> <head> <style> div

我有一个错误，我正试图缩小范围，它被证明是一个doozie。我正在制作一个模式叠加，在IE8中，出于某种原因，我可以单击“通过”，聚焦输入并选择它下面的文本

在IE9、FF、Chrome中，一切都按预期工作。不幸的是，我设计的简化测试用例（如下所示）在IE8中运行良好。以前有人遇到过这个错误吗？希望节省一些时间。谢谢

<!DOCTYPE html>
<html>
    <head>
        <style>
            div {
                background: pink;
                position: fixed;
                height: 100%;
                width: 100%;
                top: 0;
                left: 0;
                opacity: 0.5;
                -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
            }
        </style>
    </head>
    <body>
        <input type="text" />
        <div></div>
    </body>
</html>


div{
背景：粉红色；
位置：固定；
身高：100%；
宽度：100%；
排名：0；
左：0；
不透明度：0.5；
-ms过滤器：“progid:DXImageTransform.Microsoft.Alpha（不透明度=50）”；
}

我明白了，我使用的是rgba（）而不是不透明，因为我只需要背景就可以有透明度

对于IE，它使用引起问题的-ms过滤器生成梯度过滤器。结果只是使用了

background: url(/images/EBEBEBB3.png);
background: rgba(255,255,255,.7);

<> P>这个问题的根本原因是IE不认为半不透明背景是有效的单击目标，因此点击被传递到下面的元素。

对于IE，您必须具有纯色背景或背景图像才能进行元素捕获。正如您所发现的，过滤器无法工作

常见的做法是使用1x1透明GIF作为IE的背景图像。然后元素将适当地捕获点击。

问题确实是，当div的背景是透明的时，IE允许点击通过。对我来说，这在任何地方都有效：

只需使用1x1像素透明GIF的base64编码作为背景，就可以停止所有的点击/点击（同样在IE9和IE8上测试）。另外，这是纯CSS，不需要额外的图像

background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);