ios下input focus弹出软键盘造成fixed元素位置移位
正常状态下

input focus软键盘弹出时

问题描述:
头部结构fixed,滚动到下部内容区域,input、textarea等focus弹出软键盘时,头部位置偏移被居中(该问题ios7 beta3已修复),当软键盘关闭时,头部结构位置又恢复正常
安卓手机下,fixed表现要比ios好,不会出现此问题
然而在移动端里,基本上所有手机,页面滚动的时候,任何js都不会执行,所以寻找css的方法(且js方法比较消耗性能)
各类大网站的解决方法:一般是页面上避免悬挂元素,或者有悬挂元素时,避免产生软键盘弹出事件
目前css的解决方法:
头部依旧fixed,中间有input、textarea等部分也fixed,width:100%,top值为顶部高度,bottom:0(如果顶部也fixed,则bottom值为底部高度),overflow:scroll
缺点:体验差,有卡顿感,且虽然也能滚动,但是手机上显示不出滚动条。
如果你有更好的解决方法,欢迎指点
ios下input focus弹出软键盘造成fixed元素位置移位的更多相关文章
- ios下input获取焦点以及在软键盘的上面
<!----/此方法基于zepto.min.js--> <!--/div元素没有blur和focus事件,blur focus 只适用于input 这类的表格元素--> < ...
- EditText根据焦点弹出软键盘
//每次启动都清除焦点 myCourse_roomId_input.setText(""); myCourse_roomId_input.clearFocus(); //判断是否获 ...
- 解决IOS safari在input focus弹出输入法时不支持position fixed的问题
该文章为转载 我们在做移动web应用的时候,常常习惯于使用position:fixed把一个input框作为提问或者搜索框固定在页面底部.但在IOS的safari和webview中,对position ...
- 禁止移动端input弹出软键盘
在做三级联动,或者一些时间插件的时候总是弹出软键盘,用下面的方法就可以禁用掉,废话不多说直接上代码. HTML代码 <div class=""> <div> ...
- mui+回复弹出软键盘
最近再做一个APP的时候,有一个评论回复的功能,在做APP的时候,直接用手指触发focus事件,来唤醒软键盘的弹出没有问题, 但是现在的功能需要对点击回复进行弹出软键盘来操作,参考过很多都有问题,后来 ...
- EditText默认不弹出软键盘
#EditText默认不弹出软键盘# 网上关于EditText默认情况下不弹出软键盘,当手触摸到EditText,获取焦点时候,才会弹出软键盘,貌似都不能用,其实,在oncreate()方法中,加上 ...
- AppCompatActivity 去掉标题栏和EditText弹出软键盘遮住输入框问题
1. AppCompatActivity去掉标题栏 此处除掉标题栏,需要注意一点,AppCompactActivity是继承自Activity.然而,AppCompactActivity据查看网上资料 ...
- (转载) EditText初始不弹出软键盘,只有光标显示,点击再弹出
EditText初始不弹出软键盘,只有光标显示,点击再弹出 2013-06-08 10:13 21305人阅读 评论(5) 收藏 举报 分类: android基础(91) 版权声明:本文为博主原创 ...
- (原)android的alertdialog中加入edittext但是不弹出软键盘等问题的解决与原因
摘要:alertdialog中加入edittext但是不弹出软键盘等问题网上有很多不管用的解决方案, 本文意在给出更有效的解决办法,并初步探究其原因 正文 在对话框中插入文本框是十分常见的需求 通常我 ...
随机推荐
- JavaScript设计模式-单例模式、模块模式(转载 学习中。。。。)
(转载地址:http://technicolor.iteye.com/blog/1409656) 之前在<JavaScript小特性-面向对象>里面介绍过JavaScript面向对象的特性 ...
- linux GO语言配置安装
1.下载地址 https://golang.org/dl/ 2.解压 解压到/usr/local/go目录下 cd /usr/local/go bin/go version 执行如上命令出现go的版本 ...
- Webservice接口和Http接口
WebService又是一种高级应用,与之前学习的Struts.Spring.Hibernate等框架不同.WebService是面向服务的架构(SOA),看起来像是比SSH框架要大.那么它到底是做什 ...
- PHP_解析xss攻击、sql注入
/** * PHP解决XSS(跨站脚本攻击)的调用函数 * PHP跨站脚本漏洞补丁,去除XSS(跨站脚本攻击)的函数,把以下代码保存在function.php文件中,在需要防御的页面中include ...
- php学习记录 易混淆
1.echo和print的区别 PHP中echo和print的功能基本相同(输出),但是两者之间还是有细微差别的.echo输出后没有返回值,但print有返回值,当其执行失败时返回flase.因此可以 ...
- html list <==> unformatted list
两者的区别很大不得不擦呢,任何两个东西的差别都很大,不得混淆.---一个有ul/ol的选择,一个没有
- jquery: 一些常见的获取
jq1.6+ 勾选checked $(#id).attr("checked", true); 判断checkbox是否选择 $(#id).prop("checked&qu ...
- Linux 命令速查
学生信,Linux是最最基本的技能,要尽量将自己的工作平台转移到Linux,编程写脚本,这样会极大的提升工作效率,找工作时也不会太怂.Linux所有的任务都是通过命令来完成的,具有高度的统一性.Lin ...
- MySQL锁监视器
还在为看不懂何登成的加锁处理分析文章感到羞愧吗? 还在因为何大师的笔误,陷入深深的迷茫吗? 只要你拥有大于5.6.16版本的MySQL,锁监视器你值得拥有! 快速入门 开启 set GLOBAL in ...
- centos7命令
查看ip ip addr ip link 添加服务 systemctl enable nginx 添加防火墙端口 firewall-cmd --zone=public --add-port=80/tc ...