IOS11 底部输入框被手机输入法遮住

时间:2022-02-19 21:04:27

前言:

最近在做一个评论的功能,前端页面中输入评论框在页面的最底部,在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. Linux crontab 命令格式与详细例子

    基本格式 :* * * * * command分 时 日 月 周 命令 第1列表示分钟1-59 每分钟用*或者 */1表示第2列表示小时1-23(0表示0点)第3列表示日期1-31第4列表示月份1-1 ...

  2. 使用ycsb测试cassandra

    参考 https://github.com/cloudius-systems/osv/wiki/Benchmarking-Cassandra-and-other-NoSQL-databases-wit ...

  3. Android实现登录

    登录界面布局文件         1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android ...

  4. Java &colon; 使用jar包里的图片作为窗体的ICON

    文件结构: 源包- -/code/Jframe1.java -/image/1.png 目标: Jframe1.java 使用"/image/1.png"作为左上角的icon 核心 ...

  5. 机器学习技法-AdaBoost元算法

    课程地址:https://class.coursera.org/ntumltwo-002/lecture 重要!重要!重要~ 一.Adaptive Boosting 的动机 通过组合多个弱分类器(hy ...

  6. codevs 3185 队列练习1

    题目描述 Description 给定一个队列(初始为空),只有两种操作入队和出队,现给出这些操作请输出最终的队头元素. 操作解释:1表示入队,2表示出队 输入描述 Input Description ...

  7. 大学生IT博客大赛最技术50强与最生活10强文章

    姓名 学校 文章标题 文章地址 刘成伟 井冈山大学 [mystery]-linux黑客之网络嗅探底层原理 http://infohacker.blog.51cto.com/6751239/115511 ...

  8. JAVA--好友界面面板

    package GongYou; //package windows.best_demo; import java.awt.*; import javax.swing.*; import java.u ...

  9. angularjs三级联动

    <div ng-controller="AjaxCtrl"> <h1>AJAX - Oriented</h1> <div> Coun ...

  10. 2016最热门的PHP框架

    每个PHP框架都拥有各自独特的地方.同时PHP语言已经获得了巨大的认同并且成为了世界上最通用的服务器脚本语言.PHP也俨然成为了最容易学习的web动态开发语言.在PHP发展的同时,PHP框架也迅速崛起 ...