5

我正在为工作 atm 开发这个项目，其中将在三星 Galaxy 选项卡上播放电子学习。游戏只是一个网站，但将显示为应用程序。

当您第一次登录时，您会看到一个带有此欢迎消息的弹出窗口，其后面是一个透明的黑色覆盖层。

问题是，在 PC 上，在 Firefox 上一切正常，但在平板电脑上 Z-index 似乎不起作用。它无法调试，我找不到有关此问题的任何文档。那么有谁知道 z-index 在平板电脑上的工作方式是否有所不同，或者我该如何解决？

弹出窗口有 z-index 999，覆盖是 z-index 998，对此有什么想法吗？我将继续在谷歌上搜索，并将发布我取得的所有进展。

编辑：将在 Jquery 中创建叠加层： var showPopup = '<%=ViewData("showPopup").toString()%>'

if (showPopup == "True") { $('body').prepend('<div class="overlay"></div>'); $('#welcomeBox').show(); }

现已解决，请参阅评论以获取解决方案。

4

2 回答 2

10

派对迟到了，但我发现最好的解决方案是添加 -webkit-transform: translate3d(0,0,0); 到绝对定位和 z 索引的项目。每次都解决了我的问题。

于 2013-05-16T01:51:52.790 回答
0

找到了答案，答案部分在stackoverflow上可以在这里找到：Android Webkit: Absolutely located elements don't respect z-index

其余的在教程中找到。

解决方案如下：

我在 jQuery 中添加了叠加层，但弹出窗口在 html 中但只是隐藏了。所以我将那部分代码也添加到了 jQuery 检查中。为了防止弹出窗口继承叠加层的不透明度，我不得不$('body').prepend再次使用。现在一切正常。

于 2011-11-29T08:10:39.437 回答