Mobile Safari 经常会遇到固定元素的复杂情况，特别是当虚拟键盘覆盖导航中的输入字段时。据观察，导航突然转移到意外位置，破坏了其预期行为。
要解决此问题，请考虑以下解决方案：
1.固定到绝对切换
当输入获得焦点时，此方法动态地将固定元素的位置交替为绝对位置，并在失去焦点时将其恢复为固定。
<code class="CSS">.header {
position: fixed;
}
.footer {
position: fixed;
}
.fixfixed .header,
.fixfixed .footer {
position: absolute;
} </code><code class="JavaScript">if ('ontouchstart' in window) {
/* cache dom references */
var $body = $('body');
/* bind events */
$(document)
.on('focus', 'input', function() {
$body.addClass('fixfixed');
})
.on('blur', 'input', function() {
$body.removeClass('fixfixed');
});
}</code>替代解决方案：
探索以下链接提供的解决方案。这些建议为这个特定的移动 Safari 错误提供了潜在的解决方案。
[修复移动 Safari 中的固定位置](http://dansajin.com/2012/12/07/fix-position-fixed/)
以上是如何使用虚拟键盘修复 Mobile Safari 中的导航位移？的详细内容。更多信息请关注PHP中文网其他相关文章！
