博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ios下input focus弹出软键盘造成fixed元素位置移位
阅读量:6912 次
发布时间:2019-06-27

本文共 482 字,大约阅读时间需要 1 分钟。

正常状态下

 

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

缺点:体验差,有卡顿感,且虽然也能滚动,但是手机上显示不出滚动条。

如果你有更好的解决方法,欢迎指点

转载于:https://www.cnblogs.com/zhangwenkan/p/4422576.html

你可能感兴趣的文章
【linux】——linux中各个目录的意义
查看>>
程序人生--2005年(30)
查看>>
开源项目之Android StandOut(浮动窗口)
查看>>
分享:树状分类结构,数据库构建(预排序历遍算法)
查看>>
IIS命令
查看>>
学习 easyui 之三:panel 分析
查看>>
BSTR、char*和CString转换
查看>>
盘点影视剧中的那些经典“清流男”
查看>>
CDC,CPaintDC,CClientDC,CWindowDC
查看>>
信号退出【Linux学习笔记】kill及kill -9的用法及如何实现进程的优雅退出
查看>>
搜索引擎是怎么删除重复网页的
查看>>
Objective-C规范注释心得——同时兼容appledoc(docset、html)与doxygen(html、pdf)的文档生成...
查看>>
ARCGIS RUNTIME FOR IOS总结(六)
查看>>
批量scp脚本——从多台机器拷贝文件
查看>>
Oracle 11g安装图文攻略
查看>>
用VBA宏从一个工作薄复制内容到另一个工作薄
查看>>
Android架构分析之使用自定义硬件抽象层(HAL)模块
查看>>
VC6.0启动File-open和Project-add file to project崩溃的解决方法
查看>>
死锁线程探讨Java中的死锁现象
查看>>
Java HashMap的死循环 以及 LRUCache的正确实现
查看>>