ios移动端在双击弹出层的时候会出现页面下移,露出底层页面的现象

解决办法:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
(function() {
var agent = navigator.userAgent.toLowerCase(); //检测是否是ios
var iLastTouch = null; //缓存上一次tap的时间
if(agent.indexOf('iphone') >= 0 || agent.indexOf('ipad') >= 0) {
document.body.addEventListener('touchend', function(event) {
var iNow = new Date().getTime();
iLastTouch = iLastTouch || iNow + 1 /** 第一次时将iLastTouch设为当前时间+1 */ ;
var delta = iNow - iLastTouch;
if(delta < 500 && delta > 0) {
event.preventDefault();
return false;
}
iLastTouch = iNow;
}, false);
}
})();
</script>
</body>
</html>

解决ios移动端双击页面下移的更多相关文章

  1. vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题

    异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...

  2. 解决IOS移动端 Safari流浪器 onclick无法触发的问题

    在移动端布局的时候, 在底部有一个button, 页面超过两屏, 是一个可滚动的的网页, 当运行在移动端Safari浏览器上的时候, 向下滑动页面, 浏览器的头部和尾部会自动隐藏, 这样可视区域就会变 ...

  3. 解决ios下的微信页面背景音乐无法自动播放问题

    在做各种html5场景页面的时候,插入背景音乐是一个很普遍的需求,我们都知道,ios下的safari是无法自动播放音乐的,以至于现在行程一种认知,ios是没有办法自动播放媒体资源的,这个认知其实是错误 ...

  4. 解决IOS移动端固定定位失效问题

    根据浏览器窗口position:fixed; 定位在底部的元素,会随着屏幕的滚动而滚动,在iOS系统上不起作用. <div class="header">头部</ ...

  5. 解决IOS下window.open页面打不开问题

    问题如标题所写,在ajax回调里面拿到即将要跳转的链接url,使用window.open(linkUrl),没有起作用,而且代码也没有报错,查找原因是:大部分现代的浏览器(Chome/Firefox/ ...

  6. 移动端-解决ios连续点击页面上移问题

    引入js即可 //解决ios双击页面上移问题//在项目中测试不紧input/button这些表单控件有这个问题,p,div等也有问题,于是乎就直接在body开刀了(function(){ var ag ...

  7. 解决ios双击页面上移问题

    做webapp时,ios有个默认双击事件,会缩放页面,并将当前点击的位置居中到屏幕,本来也没什么,但是当页面中有fixed定位的元素时,这时候你就会神奇的发现,fixed元素所见不所得了! 还有就是页 ...

  8. 【原】移动端vue页面点透事件 - 分析与解决

    近期项目遇到了vue页面事件被带到下一个页面的问题,也就是我们常说的点透事件,主要表现在android机器上,花了不少时间折腾,简单做下总结~ vue页面之间的切换通过Vue Router的route ...

  9. 移动端上传照片 预览+Draw on Canvas's Demo(解决 iOS 等设备照片旋转 90 度的 bug)

    背景: 本人的一个移动端H5项目,需求如下: 需求一:手机相册选取或拍摄照片后在页面上预览 需求二:然后绘制在canvas画布上 这里,我们先看一个demo(http://jsfiddle.net/q ...

随机推荐

  1. Easy Excel导出

    @GetMapping(value = "/down2") public void down2(HttpServletResponse response) throws Excep ...

  2. mysql 多表join

    两个表可以简单地写为 select a.,b. from a left join b on a.id =b.id; 三个以上 select a.,b. from a left join b on a. ...

  3. Python3.6爬虫+Djiago2.0+Mysql --数据爬取

    1.下载对应版本的python mysql 模块 我的是:pymssql-2.2.0.dev0-cp36-cp36m-win_amd64.whl 2.手动创建table create table gr ...

  4. IDEA启动springboot项目一直build

    启动main方法后,项目一直在不断的build,期间截了两张一闪而过的提示 我用的是Run Dashboard面板,不论是通过删除configuration,rebuild,删除IDEA缓存都没有效果 ...

  5. 使用Eclipse的Working Set管理项目

    想必大家的Eclipse里也会有这么多得工程...... 每次工作使用到的项目肯定不会太多...... 每次从这么大数量的工程当中找到自己要使用的, 必须大规模的滚动滚动条......有点不和谐了. ...

  6. appscan如何扫描移动应用APP

    1.前置条件:让手机和电脑处于同一WIFI下 1打开appscan,选择手动探索/外部设备. 2在弹出的对话框页面点击右上角“记录代理配置”. 3在弹出的页面选择记录代理页签,设置Appscan代理端 ...

  7. 从0开始学习ssh之资源分类

    更目录下面,新建config用于放配置文件,新建test用于放置测试文件.src目录用于放置源代码.由于ssh是三层,因此新建三层包(dao,service,view).其中dao和service还有 ...

  8. CAS添加验证码功能

    1.  cas.war 下面的web-inf/web.xml  lib添加  kaptcha.jar kaptcha.jar通过maven获取 <dependency> <group ...

  9. mybatis 中 if else 用法

    mybaits 中没有 else 要用 chose when otherwise 代替 下面就是MyBatis中的if....else...表示方法 <choose> <when t ...

  10. Spring 调度工具Quartz cron 表达式的格式

    http://chinaxxren.iteye.com/blog/839630 Quartz cron 表达式的格式十分类似于 UNIX cron 格式,但还是有少许明显的区别.区别之一就是 Quar ...