移动端,input输入框被手机输入法解决方案
当界面元素靠下时候的时候,input输入框会被系统的键盘遮挡。
我们可以让界面向上移动一定距离去避免遮挡。
$('#money').click(function(){
setTimeout(function(){
$(this).scrollIntoView(); // 参数可以是true, false, 空参数
}, 300);
})
基于jquery写的事件。
首先绑定触发元素(input)框,scrollIntoView(alignWithTop) 属性滚动浏览器窗口或容器元素,以便在当前视窗的可见范围看见当前元素。
click事件触发的时候,输入框会向上移动,移动的范围是界面可见的程度。后面参数是延时操作的时间。
单位是毫秒。
移动端,input输入框被手机输入法解决方案的更多相关文章
- 移动端input“输入框”常见问题及解决方法
转自 https://www.cnblogs.com/ljx20180807/p/9837748.html 1. ios中,输入框获得焦点时,页面输入框被遮盖,定位的元素位置错乱: 当页input存在 ...
- 移动端input输入框把页面顶起, 收起键盘页面复原不了问题
我相信大家平时也会遇到这种问题, 移动端 input 或者 textarea获取光标, 整个页面被顶起来, 键盘收起, 页面不复原的问题 ====>>>> 我这边提供两种解决 ...
- IOS11 底部输入框被手机输入法遮住
前言: 最近在做一个评论的功能,前端页面中输入评论框在页面的最底部,在ios11中手机的输入法会遮住那个输入框,在其它手机上正常. 一直在找有关的解决方案,虽然最终也没有解决,还是记录过程,供参考. ...
- 移动端 input 输入框实现自带键盘“搜索“功能并修改X
主要利用html5的,input[type=search]属性来实现,此时input和type=text外观和功能没啥区别: html代码入下: <form action="" ...
- 移动端页面输入法挡住input输入框的解决方法
1,宽高用了百分比或者vw/vh布局的,input输入框的最外层父容器的可用JS动态设置为当前窗口的宽高(防止输入法的弹出令页面变形) 2,最外层父容器用了fixed定位的,不要用top:0;要用bo ...
- 点击底部input输入框,弹出的软键盘挡住input(苹果手机使用第三方输入法 )
测试移动端页面的时候,偶然发现点击底部input输入框时,弹出的虚拟键盘偶尔会挡住input输入框. 输入框固定在页面底部,如图所示: input固定底部设计图.png 点击底部input输入框唤 ...
- 项目小结:手机邮箱正则,URL各种判断返回页面,input输入框输入符合却获取不到问题
1.手机邮箱正则 近两年出来很多新号码,听说199什么的都有了- -导致以前的正则不能用了....这就很难过,总是过一段时间出一种新号码.因此,我决定使用返朴归真的手机正则. 手机正则:var reg ...
- 解决手机浏览器上input 输入框导致页面放大的问题(记录)
在微信手机页面开发当中,页面是没有问题的,但是当焦点在input输入框的时候,手机页面会自动放大. 加入以下代码在head 区,可解决此问题 <meta name="viewport& ...
- IOS 固定定位底部input输入框,获取焦点时弹出的输入法键盘挡住input
移动页面经常会做到这样一个效果,看下面的图片,重点就是那个固定定位的底部,里面有个input输入框,在输入字符的时候,安卓手机看着是完全没有问题! 1.页面没有点击底部input的初始状态 2.安卓手 ...
随机推荐
- linux常用命令汇总(更新中...)
文本查看与编辑 1.文本编辑命令 vi/vim 2.查看文件内容命令 命令 说明 命令格式 参数 cat 将一个文件的内容连续输出在屏幕上 cat [-option] 文件名 -n:将行号一起显示在 ...
- 笔记:I/O流-字符集
Java 库的 java.nio 包用 Charset 类统一了对字符集的转换,支付姐建立了两个字节Unicode码元序列与使用本地字符编码方式的字节序列之间的映射,Charset类使用的时由IANA ...
- Spring Boot Junit单元测试
http://blog.csdn.net/catoop/article/details/50752964
- 【Zabbix】在CentOS7上安装Zabbix3.0
Zabbix安装 首先说明一下,本文主要参考了[http://www.linuxidc.com/Linux/2016-11/137030.htm]和[http://www.cnblogs.com/XY ...
- linux --> Linux变量之$#, $*, $@含义
Linux变量之$#, $*, $@含义 一.介绍 $# //是传给脚本的参数个数 $ //是脚本本身的名字 $1 //是传递给该shell脚本的第一个参数 $ //是传递给该shell脚本的第二个参 ...
- Python第二话 初识复杂数据类型(list、dictionary、tuple)
上一篇我们简单认识了数据类型:数字number和字符串string,这篇我们就来隆重介绍一下重量级的数据类型:列表list.字典dictionary和元组tuple. 一.列表List: ①列表是什么 ...
- linux小白成长之路6————安装Java+Apache(httpd)+Tomcat
[内容指引] 安装Java环境: 查看JDK版本: 安装Apache(httpd); 安装Tomcat: 设置服务开机启动. 1.安装Java环境 指令: yum intall java-1.8.0* ...
- CountDownLatch 源码解析—— countDown()
上一篇文章从源码层面说了一下CountDownLatch 中 await() 的原理.这篇文章说一下countDown() . public void countDown() { //CountDow ...
- 听翁恺老师mooc笔记(10)--结构
定义结构: 在程序里,如果想要表达一个数据就需要一个变量,而每个变量又都需要一个类型,之前学过C语言中有int.double.float.char等这些基础类型,还有指针.数组等.如果你要表达的数据比 ...
- 2017-2018-1 Java演绎法 第四五周 作业
团队任务:撰写<需求规格说明书> 团队组长:袁逸灏 本次编辑:刘伟康 流程.分工.比例 (比例按照任务的费时.难度和完成情况估算) 流程 确定任务 -→ 分配任务 -→ 各组员完成各自任务 ...