WP7 IE - CSS 模式弹出窗口：点击/点击穿过覆盖 div 并触发应该不可见的链接

我正在制作一个针对移动设备的 HTML/CSS 和基于 jQuery 的文件管理器。其中一部分涉及使用基于 CSS 的模式对话框进行各种文件操作（复制、删除等）。

我实现了这样的模式对话框行为：

<div id="overlay">
     <div id="modalBoxControls"><a href="#" id="modalBoxClose">[close]</a></div>
     <div id="modalBox">
          <div id="modalBoxContent"></div>
     </div>
</div>

CSS 是：

#overlay {
 position: fixed;
 left: 0px;
 top: 0px;
 width:100%;
 height:100%;
 text-align:center;
 z-index: 1000;
 background: ([semi-transparent png]);
 display: none;
}
#modalBox {
width: 80%;
background-color: #fff;
margin: 0px auto;
opacity: 1;
}

我使用 jQuery 通过调用来显示和隐藏它.fadeIn() and .fadeOut() on the overlay元素。

到目前为止一切顺利 - 这在我的开发机器上的所有浏览器中都运行良好。

然而，当在我的 WP7（Samsung Omnia 7）上进行测试时，发生了一件相当奇怪的事情。模式对话框显示正常，其后面的页面被涂黑。但是点击（或点击）会经过#overlay并激活其后面的任何内容，即使它完全覆盖了后面的所有内容并且它的 z-index 为 1000。

我还使用 Nick Stakenburg 著名的“Lightview”插件（一段经过充分测试和改进的代码）对此进行了测试，并在 WP7 上的 IE 上发现了相同的行为。

所以看来这可能是浏览器本身的错误。

有谁知道这个问题有什么解决办法吗？

编辑 - jsFiddle 问题示例

因此，请在您的 WP7 设备中检查一下，看看即使文件顶部有覆盖层，仍然可以单击这些文件：http://jsfiddle.net/michaelbromley/CHU76/

如果“激活其后面的任何内容”意味着像文本输入这样的输入控件，那么我遇到了同样的问题。老实说我不知道​​有什么好的解决办法。我的解决方法是在显示弹出窗口期间禁用输入控件，然后通过删除禁用属性来激活它们。该问题似乎与 jqmobile 无关，但应该是普遍行为。