我正在为 iphone 和 android 开发一个 phonegap 应用。
我有一个黑色叠加层，当用户点击按钮时会显示一条加载消息。
在 ios 上一切正常，但在 android 上，fadeIn() 函数仅显示部分叠加层。就像，真的，零件。有时只是底部，有时是底部和右上角......真的很奇怪。
尽管如果我改用 .show()，一切都会正常进行。
你见过这样的事情吗？ (质量很差，但你可以看到下半部分的覆盖层，以及右上角的半透明覆盖层。)
Android 上的 .fadeIn() 函数有什么问题？
(如果你需要，这里是css)
.black-overlay {
position: absolute;
width: 100%;
height: 120%;
background-color: #000;
color: #FFF;
display: none;
z-index: 99999;
top:0;
}
以及 HTML 代码的开头:
<body class="side">
<div class="black-overlay row-fluid"> //overlay
<div class="span12 loading-splash">
<div class="span12"><span>Chargement...</span></div>
<div class="span12 span-no-margin"><img src="img/ajax-loader_black.gif" alt=""></div>
</div>
</div>
<div class="app container-fluid event-creation"> //Rest of the app...
最佳答案
这是我用于背景叠加的一些 CSS。
.ajax-loader-background
{
background-color: rgba(0,0,0,0.2);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#30000000,endColorstr=#30000000);
zoom: 1; /* Force hasLayout in IE. */
position: absolute;
top: 0px;
left: 0px;
right: 0px;
bottom: 0px;
z-index: 99999;
}
我不确定为什么使用 .fadeIn 会得到不同的结果，除了 jQuery 可能需要知道元素的宽度/高度，如果它不可见，它的宽度为零/高度。
我注意到 width: 100% 和 left: 0px; 之间存在细微差别；右:0px。与 height: 100% 相同。您还将高度设置为 120%，这是我从未见过的绝对定位。您不必为叠加层执行此操作。
关于javascript - Android jQuery fadeIn 奇怪的行为，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16486001/