[BUG]微信浏览器 iOS input 失焦页面不回弹
描述
IOS13.
IOS设备中,input唤醒软键盘后,body整体会向上滚动,如果input框输入完成确定后,如果页面在最底部则不回弹,导致fixed布局实际效果上移,fixed布局内按钮点不到。
如图

解决方案
input onblur 让body滚动,页面回弹
function inputBlur() {
if (/iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase())) {
let speed = 1;
setTimeout(function () {
var currentPosition = document.documentElement.scrollTop || document.body.scrollTop;
currentPosition -= speed;
window.scrollTo(0, currentPosition); // 页面向上滚动
currentPosition += speed;
window.scrollTo(0, currentPosition); // 页面向下滚动
});
}
}
[BUG]微信浏览器 iOS input 失焦页面不回弹的更多相关文章
- fastclick使用与 fastclick ios11.3相关bug原因(ios输入框点击变得不灵敏,ios input失焦后,页面上移,点击不了)
FastClick 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击.为了能够立即响应用户的点击事件,就有了FastClick. 安装fastc ...
- 解决微信浏览器无法使用reload()刷新页面
场景是这样子的,页面在初始化时有一个ajax请求,在页面上有一个按钮,点击的时候执行window.location.reload(),正常情况reload()后页面依然会向后台发出请求,但在安卓的微信 ...
- js网页判断移动终端浏览器版本信息是安卓还是苹果ios,判断在微信浏览器跳转不同页面,生成二维码
一个二维码,扫描进入网页,自动识别下载苹果和安卓客户端,判断网页如下,(只有苹果的微信不能自动跳转)所以加个微信判断. <!DOCTYPE html> <html> <h ...
- 解决苹果手机(IOS)input失焦后,页面不恢复的问题
var winHeight = $(window).height(); var u = navigator.userAgent, app = navigator.appVersionvar isIOS ...
- 改进:js修改iOS微信浏览器的title
问题简介 前端入门没多久,可能连入门也不算,最近网上流行各自书籍改名,什么<前端开发,从入门到放弃>,<Android开发,从入门到改行>之类的,程序员真是个爱自嘲的群体,但我 ...
- JS动态修改微信浏览器中的title
JS动态修改微信浏览器中的title我们的原理是设置一个ifame然后我们再加载一下就可以实现了,具体的例子如下所示. 平时使用JS修改title,直接document.title=新标题就好了 这样 ...
- 解决H5在微信浏览器或QQ浏览器修改title的问题
传送门:http://blog.csdn.net/code_for_free/article/details/51195468 如果是Android,使用 document.title = ‘1231 ...
- vue-router 在微信浏览器中操作history URl未改变的解决方案
在PC端和手机浏览器中router.replace() or router.push()能够正常使用,页面的地址和页面都正常显示:但是在微信中,从/a页面通过router.push('/b')跳转到/ ...
- C#判断用户是否使用微信浏览器,并据此来显示真实内容或二维码
平时我们看一些网页的时候会发现这样的功能:有的页面只能在微信里访问,如果在电脑上访问就只显示当前地址的二维码.这个用C#怎么实现呢?我们结合代码来看看. 首先,我们需要先判断用户使用的是什么浏览器,这 ...
随机推荐
- tomcat部署项目方式
三大部署方式1. Context描述文件部署通过独立的Context文件描述清楚项目的访问路径和地址,tomcat在启动的时候会解析这个Context文件,创建一个Context对象. Conte ...
- 吴裕雄--天生自然python学习笔记:Python MySQL - mysql-connector 驱动
本章节我们为大家介绍使用 mysql-connector 来连接使用 MySQL, mysql-connector 是 MySQL 官方提供的驱动器. 我们可以使用 pip 命令来安装 mysql-c ...
- docker实践-安装wordpress
很多人都有搭建wordpress的经历,可能被某些环境的配置搞得焦头乱耳的,这里使用docker,可以很轻松的进行wordpress的搭建工作. 安装 Docker sudo apt-get inst ...
- HashMap的四种遍历!
HashMap的四种遍历 import java.util.Collection; import java.util.HashMap; import java.util.Map; import jav ...
- 用了python多进程,我跑程序花费的时间缩短了4倍
应用场景:本人需要对200万条网页html格式数据进行清洗,提取文字后将分词结果写入数据库,之前做了一次,大概花费了80多个小时才跑完.机器配置是4核,内存8G:开完会领导让再改点东西重新跑一遍,然后 ...
- springboot ——oracle.jdbc.driver.OracleDriver
网上很多案例讲是oracle的驱动包没有导入进去,我之前尝试下图示方式导入解决该问题: 但是在后期调试的时候,发现会影响后续oracle数据源连接驱动的问题,导致不能查询,因此想,另辟途径,解决这个问 ...
- Android 一个3D相册源码
我们专业课有Android的学习,最后老师让做一个简单的Android应用程序.我在网上找些资料,加上自己改造一下做了一个3D相册. 程序仿照Android的相册功能,调用Gallery类对相片进行浏 ...
- angular知识点(2)
angular知识点(2) 1.为了代码规范,对于需要自动加载的依赖,需要在前面加上注释,注释为://@ngInject 或者是/*@ngInject*/ 2.ngSwitch的应用 在需要用到选择出 ...
- Channel Estimation for High Speed Wireless Systems using Gaussian Particle Filter and Auxiliary Particle Filter
目录 论文来源 摘要 基本概念 1.时变信道 2.粒子滤波 3.高斯粒子滤波 4.辅助粒子滤波 比较 借鉴之处 论文来源 International Conference on Communicati ...
- python复制多层目录下的文件至其他盘符对应的目录中
一.需求 app打包需要打入一些H5进去,以便更快的加载页面.这些H5文件是散落在各个文件夹中的[如下列所示],偶尔各个文件夹还需新增文件,每次新增一个文件,需要改动jenkins上job脚本,比较麻 ...