前言:

最近在做一个评论的功能,前端页面中输入评论框在页面的最底部,在ios11中手机的输入法会遮住那个输入框,在其它手机上正常。

一直在找有关的解决方案,虽然最终也没有解决,还是记录过程,供参考。

1,对输入框这个元素(如pannel)做操作

pannel.scrollIntoView(true);或者

pannel.scrollIntoView(true);

pannel.scrollIntoViewIfNeeded();

自己试了但没有什么效果。

2,scrolltop; window.scrollTo(0, value);手动上推

3,英文找了一篇有关的文章,解决方案如下:但是好像也没什么效果。

document.body.style.overflow = ‘hidden’;
document.body.style.height = ‘100%’;
document.body.style.width = ‘100%’;
if (osIsiOS()) {
document.body.style.position = ‘fixed’;
}

IOS11 底部输入框被手机输入法遮住的更多相关文章

  1. 移动端,input输入框被手机输入法解决方案

    当界面元素靠下时候的时候,input输入框会被系统的键盘遮挡. 我们可以让界面向上移动一定距离去避免遮挡. $('#money').click(function(){ setTimeout(funct ...

  2. 移动前端手机输入法自带emoji表情字符处理

    今天,测试给我提了一个BUG,说移动端输入emoji表情无法提交.很早以前就有思考过,手机输入法里自带的emoji表情,应该是某些特殊字符.既然是字符,那应该都能提交才对,可是为啥会被卡住呢?搜了一下 ...

  3. paip.android 手机输入法制造大法

    paip.android 手机输入法制造大法 作者Attilax ,  EMAIL:1466519819@qq.com 来源:attilax的专栏 地址:http://blog.csdn.net/at ...

  4. 【转】移动前端手机输入法自带emoji表情字符处理

    http://blog.csdn.net/binjly/article/details/47321043 今天,测试给我提了一个BUG,说移动端输入emoji表情无法提交.很早以前就有思考过,手机输入 ...

  5. 记录移动端html界面中底部输入框触发焦点时键盘会把输入框遮挡的问题

      //浏览器当前的高度 var oHeight = $(document).height(); //监听窗口大小的时候动态改变底部输入框控制器的定位 $(window).resize(functio ...

  6. baidu手机输入法:邂逅"吹神"的声场漫游

        "十年,好久不见,兄妹,所有还好?年月如歌,你的背包.却仍然没有筛选.装满红玫瑰.人来人往,爱情搬运,纵使我成了K歌之王.也谢谢你.依然让我的全世界失眠. 孤单患者.不如不见,不要说 ...

  7. mui弹出输入法遮住input表单元素

    转自https://www.cnblogs.com/devilyouwei/p/6293190.html mui弹出输入法遮住input表单元素   问题如下:当我用mui开发app时,在mui-sc ...

  8. h5开发安卓机型点击输入框调起输入法,输入框被键盘遮挡的解决方法

    前言: 从以前的项目中找一个问题的解决方案,顺带找到了这个安卓机型调起输入法,页面没有自动上滑导致输入框被弹起的键盘遮挡的解决方案.这个问题只有安卓机型页面中的输入框处于底部(也就是底部键盘区域)的时 ...

  9. mint fcitx搜狗输入法不显示输入框,其他输入法丢失皮肤

    mint18.3 因为这个原因刚刚重装过,结果一不留神又这样了. 这次原因相对清晰: 双屏显示下,合屏睡眠,打开之后,发现卡死了.屏幕分辨率改变了似的. 然后再重启,发现输入法悬浮框变大了,然后输入法 ...

随机推荐

  1. js中的arguments

    了解这个对象之前先来认识一下javascript的一些功能: 其实Javascript并没有重载函数的功能,但是Arguments对象能够模拟重载.Javascrip中国每个函数都会有一个Argume ...

  2. vue-cli3.0之vue.config.js的配置项(注解)

    module.exports = { // 部署应用时的基本 URL baseUrl: process.env.NODE_ENV === 'production' ? '192.168.60.110: ...

  3. git遇到的问题 .Git: There is no tracking information for the current branch.

    1.Git: There is no tracking information for the current branch. 在执行git pull的时候,提示当前branch没有跟踪信息: git ...

  4. ASP.NET4.0所有网页指令

    ASP.NET网页指令(Page Directive)就是在网页开头的标签声明: <% Page Language="C#" %> 而指令的作用在于指定网页和用户控件编 ...

  5. crontab 从nano 转换为 vim

      crontab默认编辑器为nano,不方便使用. 修改crontab默认编辑器为vi或者其他的编辑器. export EDITOR="/usr/bin/vim" ; cront ...

  6. qtp10 安装笔记

    windows10系统安装QTP 10 1 QTP10 程序文件夹下,找到“setup”双击它运行安装程序-点击 否 继续安装 2 安装必要组件 3 下一步 选择安装程序目录-安装插件 直到完成安装 ...

  7. 提示“Web打印服务CLodop未安装启动”的各种原因和解决方法

    旧版提示:"CLodop云打印服务(localhost本地)未安装启动!"新版提示:"Web打印服务CLodop未安装启动,点击这里下载执行安装(若此前已安装过,可点这里 ...

  8. faster rcnn训练自己的数据集

    采用Pascal VOC数据集的组织结构,来构建自己的数据集,这种方法是faster rcnn最便捷的训练方式

  9. codeforces231C

    To Add or Not to Add CodeForces - 231C A piece of paper contains an array of n integers a1, a2, ..., ...

  10. mysql严格模式的开启、关闭

    关于mysql严格模式的开启.关闭 由于项目中对一些默认值设置问题,以及种种原因,mysql数据库需要使用非严格模式开发(mysql最近的版本默认是开启严格模式的). linux下mysql服务下操作 ...