怎样才能点击一个位置：固定;身高：100％;宽度：在IE8中覆盖100％？

我有一个错误，我试图缩小范围，它证明是一个doozie。我正在做一个模式覆盖，并在IE8出于某种原因，我可以点击“通过”，焦点输入和选择下面的文本。怎样才能点击一个位置：固定;身高：100％;宽度：在IE8中覆盖100％？

在IE9，FF，Chrome中一切正常。不幸的是，一个简化的测试用例我在一起（如下所示）在IE8中工作得很好。有没有人遇到过这个bug？希望能节省一些时间。谢谢！

<!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>

来源

2012-01-10 leeoniya

想通了，我使用rgba（）而不是不透明，因为我只需要背景具有透明度。

对于IE，它使用-ms-filter生成了渐变过滤器，这导致了问题。最终只用

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

来源

2012-01-17 19:13:14 leeoniya

这个问题的根本原因是，IE不考虑半透明的背景是有效的点击目标，因此点击次数通过对元件下方通过。

对于IE，您必须具有纯色背景或背景图片才能捕获元素点击。正如您发现的，过滤器不起作用。

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

来源

2012-01-17 19:17:11 Interrobang

问题的确在于IE允许点击在div的背景透明时流血。对我来说，这个功能无处不在：

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

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

来源

2013-11-06 12:29:05

怎样才能点击一个位置：固定;身高：100％;宽度：在IE8中覆盖100％？

回答

相关问题