我有一个带有一些文本输入的网页。 Android 浏览器(至少在 Android 2.3.4 上,这是我现在所拥有的)似乎将其自己的控制覆盖在焦点页面上的输入上。
问题是覆盖的控件是一个白色的矩形,看起来很丑。有没有办法禁用它,或者以某种方式设置它的样式?
UPDATE:
以下是 Android 模拟器的示例:
圆角和背景都丢失了。在实际设备上,我什至看不到控件周围的边框。
我可能应该提到我正在使用 jQuery Mobile。我的测试设备是 HTC Evo 4G。
相关问题:
输入在焦点上有不同的样式 https://stackoverflow.com/q/5681013/221619
如果在 HTC 设备上突出显示,WebView 中的输入元素始终具有相同的样式 https://stackoverflow.com/q/5170028/221619
最后,我在Android 2.3设备上解决了这个问题。
不可能真正删除覆盖层,但可以将覆盖层移到视口之外。
覆盖层尝试将自身定位到与输入字段相同的位置。
它复制您指定的宽度和位置偏移
position:relative
and
top:-10000px
但是覆盖不会复制通过分配的位置偏移
-webkit-transform: translate3d()
这会导致 iScroll 等 JS 库出现一些问题。
但这也有助于我们隐藏覆盖层:
input[type="password"], input[type="text"]{
position:relative;
top:-10000px;
-webkit-transform: translate3d(0, 10000px, 0);
}
您将输入字段放置在视口之外。 Overlay 将自身定位在它旁边。现在您使用translate3d() 将其移动到旧位置。
我们已经在我们的移动网络框架“qooxdoo Mobile”中使用了这个解决方案:http://demo.qooxdoo.org/devel/mobileshowcase/index.html#%2Fform http://demo.qooxdoo.org/devel/mobileshowcase/index.html#%2Fform
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)