原因:
上网查,据说是ios输入框的bug,应该说是所有会唤出软键盘的控件都有这个bug。每次软件盘获得焦点后,就会让fixed失效,
fixed失效后,相当于变成了absolute定位,要是屏幕是可以滚动的就更加惨不忍睹,本来fixed的模板会跟着滑动起来。
解决方法:
将可以滑动的内容(模块)放进一个html元素,举例放进main标签中包着,并且使用overflow-y: scroll来使溢出的内容可以滑动起来,另外添加
-webkit-overflow-scrolling: touch;
该属性可以使用main内的内容滑动起来不会显得生硬,变得平滑起来。
<main style="height: 100%;overflow-y: scroll;-webkit-overflow-scrolling: touch;">
<!--可以滚动的内容-->
</mian>
针对iOS设备上输入框出现的fixed定位失效问题,本文详细解释了其为iOS输入框的常见bug,并提供了解决方案。通过将可滚动内容置于带有overflow-y: scroll及-webkit-overflow-scrolling: touch属性的main标签内,可有效避免软键盘弹出时fixed定位失效的问题。

1933

被折叠的 条评论
为什么被折叠?



