前言:

最近在做一个评论的功能,前端页面中输入评论框在页面的最底部,在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. npm install、npm install --save、npm install --save --dev、npm install -S、npm install -D的区别

    npm install X: 会把X包安装到node_modules目录中 不会修改package.json 之后运行npm install命令时,不会自动安装X npm install X –sav ...

  2. Python--文件、文件夹、压缩包、处理模块shutil

    高级的 文件.文件夹.压缩包 处理模块 shutil.copyfileobj(fsrc, fdst[, length])将文件内容拷贝到另一个文件中 1 import shutil 2 3 shuti ...

  3. python爬虫之Splash使用初体验

    Splash是什么: Splash是一个Javascript渲染服务.它是一个实现了HTTP API的轻量级浏览器,Splash是用Python实现的,同时使用Twisted和QT.Twisted(Q ...

  4. 循环神经网络RNN及LSTM

    一.循环神经网络RNN RNN综述 https://juejin.im/entry/5b97e36cf265da0aa81be239 RNN中为什么要采用tanh而不是ReLu作为激活函数?  htt ...

  5. Reading Text from Images Using C#

    Introduction By using Optical Character Recognition (OCR), you can detect and extract handwritten an ...

  6. Nginx 反向代理如何连接上游服务器

    L:92 想上游服务器先建立TCP连接 如三次握手 下面指令可以控制握手时间 proxy_next_upstream  指令当出现502可以换个上游服务器 Tcp keepalive 一般都是由进程在 ...

  7. mysql-语法大全

    DDL语句 库 创建 create database 库名 charset utf8; 删除 drop database 库名; 修改 alter database 库名 charset latin; ...

  8. Spring 使用介绍(十)—— 单元测试

    一.概述 Spring测试框架提供了对单元测试的支持,以便使用spring的依赖注入和事务管理功能 maven依赖: <dependency> <groupId>junit&l ...

  9. java8的版本对组合式异步编程

    讨论了Java 8中的函数式数据处理,它可以将对集合数据的多个操作以流水线的方式组合在一起.本节继续讨论Java 8的新功能,主要是一个新的类CompletableFuture,它是对65节到83节介 ...

  10. 数据库SQL SELECT查询的工作原理

    一般开发员只会应用SQL的四条经典语句:select,insert,delete,update.但是我从来没有研究过它们的工作原理,这篇我想说一说select在数据库中的工作原理. B/S架构中最经典 ...