问题:

  IOS 中所有浏览器,当页面上的输入框获得焦点时,呼出键盘。

  页面底部的导航栏(position:fixed)会被键盘顶到页面的中间。

  而当输入框失去焦点时,导航栏停留在页面中间,造成页面错乱。

原因:

  IOS系统,对position:fixed支持不好。

解决:

  输入框失去焦点时,让页面滚动1px。

代码:

$(function(){
// 输入框事件绑定
$('input').on('focus', function () {
setTimeout(function () {
$('#panel_nav').css('position', 'static');
}, 100);
}).on('blur', function () {
setTimeout(function () {
$('#panel_nav').css('position', 'fixed');
            // 让滚动条滚动1次
window.scroll(0, $(window).scrollTop() + 1);
}, 100);
});
});

  $('#panel_nav') 为页面底部的导航栏

IOS系统对fixed定位支持不好的解决方法的更多相关文章

  1. iOS出现<object returned empty description>的解决方法

    iOS出现<object returned empty description>的解决方法: 使用  [str length] <= 0  判断处理

  2. 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法--(转)

    如有雷同,不胜荣幸,若转载,请注明 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了boot ...

  3. 转载------让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法

    本文是转载及收藏 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法 最近做一个Web网站,之前一直觉得bootstrap非常好,这次使用了bootstrap3,在c ...

  4. ADF控件ID变化引发JS无法定位控件的解决方法

    原文地址:ADF控件ID变化引发JS无法定位控件的解决方法作者:Nicholas JSFF定义的控件ID到了客户端时往往会改变.例如在JSFF中的一个的ID为"ot1",但是当这个 ...

  5. win7 创建vhd提示“找不到指定文件的虚拟磁盘支持提供程序”解决方法

    本文参照:https://itbbs.pconline.com.cn/diy/16509116_2.html 14楼中"坚持不放弃"用户的答案得到解决 问题复现: 1.window ...

  6. bootstrap支持ie8 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法

    做一个在线系统,PC端也要做,但要兼容千恶的IE8[IE6 是万恶,打死我都不会管IE6],IE8 是我底线了md, 在IE8下 bottstrap 错乱,变形,不支持一些属性的问题,下面看了一篇 某 ...

  7. 苹果手机对网页上样式为position:fixed的弹窗支持不好的解决办法

    在Web页面上,如果想模拟对话框效果,一般会给div元素添加position:fixed的样式来实现,然后给背景添加一个半透明的遮罩.如: .fixedDiv { position: fixed; t ...

  8. Android 10不能使用uiautomatorviewer定位元素的终极解决方法

    Android app 元素定位除了使用Appium Inspector 外,还可以使用Android SDK 里tools中的uiautomatorviewer 工具.但今天打算使用 uiautom ...

  9. 让IE6 IE7 IE8 IE9 IE10 IE11支持Bootstrap的解决方法

    首先需要确保你的HTML页面开始部分要有DOCTYPE声明.DOCTYPE告诉浏览器使用什么样的HTML或XHTML规范来解析HTML文档,具体会影响:对标记attributes .propertie ...

随机推荐

  1. BZOJ 1679: [Usaco2005 Jan]Moo Volume 牛的呼声( )

    一开始直接 O( n² ) 暴力..结果就 A 了... USACO 数据是有多弱 = = 先sort , 然后自己再YY一下就能想出来...具体看code --------------------- ...

  2. Archive for required library: ‘WebContent/WEB-INF/lib/xxx.jar cannot&n

    今天导入一个项目到eclipse,出现感叹号,而且报1. Archive for required library: ‘WebContent/WEB-INF/lib/xxxxx.jar cannot ...

  3. Python web框架有哪些

    简单易学的web.py, 大型的django:文档最完善.市场占有率最高.招聘职位最多. Tornado 具体看:http://feilong.me/2011/01/talk-about-python ...

  4. Fedora 启动 SSH服务

    一.Fedora 启动sshd服务: 1.先确认是否已安装ssh服务: [root@localhost ~]# rpm -qa | grep openssh-server openssh-server ...

  5. (step5.1.3)hdu 1213( How Many Tables——1213)

    题目大意:输入两个整数n,m.分别表示点数.对点的操作的次数.在接下来的m行中,每行有两个整数a,b.表示a和b是好朋友.(不是好朋友的不能坐在同一个桌子上) .求需要多少张桌子 解题思路:并查集 1 ...

  6. Qt程式异常崩溃处理技巧(Win)

    这篇文章谈的是 Qt4 程式在视窗系统下的异常崩溃处理技巧.所以须要在头文件里包括"#include <Windows.h>". 首先,程式难免会有异常崩溃的时候.重要 ...

  7. 比赛--找丢失的数--解题报告T

    找丢失的数 题目大意: There is a permutation without two numbers in it, and now you know what numbers the perm ...

  8. portal---easyui

    一,效果图. 二,源代码. <!doctype html><html><head> <meta http-equiv="Content-Type&q ...

  9. 深入理解GCD ( 二 )

    转自@nixzhu的GitHub主页(译者:Riven.@nixzhu),原文<Grand Central Dispatch In-Depth: Part 2/2> 欢迎来到GCD深入理解 ...

  10. CentOS Linux使用crontab运行定时任务详解

    参考博文: (总结)CentOS Linux使用crontab运行定时任务详解