这是一个创建于 4203 天前的主题，其中的信息可能已经有所发展或是发生改变。
目前系统为2.3，为web站点
我在fixed的顶部banner中加了一个absolute的a按钮，点击按钮之后用translate移入左侧fixed的div。
而这个点击触发的事件竟然会影响遥远的一个input元素不能输入中文，英文可以输入，NND，我凌乱了。
以下是我搜索到的一些参考，但是没有解决我遇到的问题，和大家一起学习了。。如果有相关朋友能够提供一点建议，不甚感激 TAT
－－－－－－－－－－－－－－－－－
The issue is you can not change keyboards due to a bug in Webkit browsers when -webkit-transform is applied
Yep - Long story short, it's a combination bug between Webkit and NoClickDelay I was using. I finally had time to sit back and step through and remove a lot of "fixing" code and resolve this.
－－－－－－－－－－－－－－－－－－－
Android 2.2/2.3’s implementation of position: fixed; can, in conjunction with seemingly unrelated styles and markup patterns, cause a number of strange issues—particularly in the case of position: absolute elements inside of position: fixed elements. These bizarre issues include—but are not limited to—the following:
Form elements elsewhere on the page—select menus in particular—can fail to respond to user interaction when an empty absolute positioned element is placed within a fixed position element. In rare cases—and specific to Android 2.2—this can cause entire pages to fail to respond to user interaction. This can seemingly be solved by adding any character to the absolute positioned element, including a non-breaking space, and in some cases even whitespace.
The above-described issue can also be triggered by an absolute positioned image inside of a fixed position element, but only when that image is using something other than its inherent dimensions. If a height or width is specified on the image using CSS, or the image src is invalid (thus having no inherent height and width), this issue can occur. If an image that is inherently, say, 50x50 pixels is placed in a fixed element and left at its inherent dimensions, this issue does not seem to occur.
When a position: fixed element appears anywhere on a page, most 2D CSS transforms will fail. Oddly, only translate transforms seem uneffected by this. Even more oddly, this issue is solved by setting a CSS opacity of .9 or below on the parent of the fixed element.
Combinations position: fixed and overflow properties are best avoided, as both have been known to cause unpredictable issues in older versions of Android OS.
Any element that triggers the on-screen keyboard, when placed inside a position: fixed element, will fail to respond to user input when using anything other than the default keyboard. This includes Swype, XT9 or, it seems, any input method apart from the standard non-predictive keyboard.
我在fixed的顶部banner中加了一个absolute的a按钮，点击按钮之后用translate移入左侧fixed的div。
而这个点击触发的事件竟然会影响遥远的一个input元素不能输入中文，英文可以输入，NND，我凌乱了。
以下是我搜索到的一些参考，但是没有解决我遇到的问题，和大家一起学习了。。如果有相关朋友能够提供一点建议，不甚感激 TAT
－－－－－－－－－－－－－－－－－
The issue is you can not change keyboards due to a bug in Webkit browsers when -webkit-transform is applied
Yep - Long story short, it's a combination bug between Webkit and NoClickDelay I was using. I finally had time to sit back and step through and remove a lot of "fixing" code and resolve this.
－－－－－－－－－－－－－－－－－－－
Android 2.2/2.3’s implementation of position: fixed; can, in conjunction with seemingly unrelated styles and markup patterns, cause a number of strange issues—particularly in the case of position: absolute elements inside of position: fixed elements. These bizarre issues include—but are not limited to—the following:
Form elements elsewhere on the page—select menus in particular—can fail to respond to user interaction when an empty absolute positioned element is placed within a fixed position element. In rare cases—and specific to Android 2.2—this can cause entire pages to fail to respond to user interaction. This can seemingly be solved by adding any character to the absolute positioned element, including a non-breaking space, and in some cases even whitespace.
The above-described issue can also be triggered by an absolute positioned image inside of a fixed position element, but only when that image is using something other than its inherent dimensions. If a height or width is specified on the image using CSS, or the image src is invalid (thus having no inherent height and width), this issue can occur. If an image that is inherently, say, 50x50 pixels is placed in a fixed element and left at its inherent dimensions, this issue does not seem to occur.
When a position: fixed element appears anywhere on a page, most 2D CSS transforms will fail. Oddly, only translate transforms seem uneffected by this. Even more oddly, this issue is solved by setting a CSS opacity of .9 or below on the parent of the fixed element.
Combinations position: fixed and overflow properties are best avoided, as both have been known to cause unpredictable issues in older versions of Android OS.
Any element that triggers the on-screen keyboard, when placed inside a position: fixed element, will fail to respond to user input when using anything other than the default keyboard. This includes Swype, XT9 or, it seems, any input method apart from the standard non-predictive keyboard.
 |
1
xiaotest 2014-04-04 01:03:19 +08:00
遇到一模一样的问题~
请问最后是如何解决的？ |
 |
2
squallsdjl OP  1
@xiaotest 解决的过程很恶心，判断安卓低端设备上，把fixed的CSS降级交互为absolute，没有其他办法吧。技术更新太快。。。。很多站点现在慢慢的都开始放弃低版本操作系统用户了。。。不过IE8+还是要考虑下。。。
|
|
3
xiaotest 2014-04-12 15:02:02 +08:00
@squallsdjl 我现在目标用户都是移动端的。做的是微信内应用，考虑到android 2.3还是不少……我来试试你提供的这个方法
|
|
4
squallsdjl OP @xiaotest 是吧，如果十分关键就临时处理一下吧，作好补丁记录就好～不过好歹是不用怎么考虑旧版本的IE。。。
|
Select Language