防止固定元素在 Mobile Safari 中跳转到输入焦点

Question

我在 Safari 中遇到了一个无情的固定位置错误。我使用的是 iOS9，但我在 iOS8 中也注意到了这一点。要重现该问题（下面的示例链接）：

\n\n

\n
1. 在整个屏幕上定位固定元素
\n
2. 用足够的内容 \xe2\x80\x93 填充它，包括带有多个输入 \xe2\x80\x93 的表单，以便它可以滚动
\n
3. 设置溢出滚动
\n
4. 在手机 Safari 中打开它
\n
5. 向下滚动直到看到第一个输入并点击它以聚焦
\n
6. 再滚动一点并聚焦下一个（并注意看起来有弹性的跳跃）
\n
7. 再滚动一点，关注下一个并继续。你关注的输入越多，跳跃就越疯狂。
\n

\n\n

示例： http: //jsbin.com/zaruba/edit?html,css ,output

\n\n

任何帮助表示赞赏。

\n

Answer 1

试试这个元：

\n

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" /> \n

\n

user-scalable=0无效。

\n

来自Safari开发库，支持的Meta标签：

\n

\n

用户可扩展

\n

确定用户是否可以放大和\n缩小\xe2\x80\x94用户是否可以更改视口的比例。设置为 yes 允许缩放，设置为 no 则禁止缩放。默认值是\是的。将用户可扩展性设置为 no 还会阻止网页在输入字段中输入文本时\n滚动。

\n

\n