解决ios10以上H5页面手势、双击缩放问题
html:<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
js:
window.onload = function() {
// 阻止双击放大
var lastTouchEnd = 0;
document.addEventListener('touchstart', function(event) {
if (event.touches.length > 1) {
event.preventDefault();
}
});
document.addEventListener('touchend', function(event) {
var now = (new Date()).getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false); // 阻止双指放大
document.addEventListener('gesturestart', function(event) {
event.preventDefault();
});
};
解决ios10以上H5页面手势、双击缩放问题的更多相关文章
- 完美解决ios10及以上Safari无法禁止缩放的问题
移动端web缩放有两种: 1.双击缩放: 2.双指手势缩放. 在iOS 10以前,iOS和Android都可以通过一行meta标签来禁止页面缩放 <meta content="widt ...
- h5 页面 禁止网页缩放
//禁用双指缩放: document.documentElement.addEventListener('touchstart', function (event) { if (event.touch ...
- 完美解决移动端H5页面的滑动穿透问题
同事的分享,记录下来. 代码如下: css: body.modal-open { position: fixed; width: 100%; } js: // 兼容低版本 document.scrol ...
- 解决ios10及以上Safari双击和双指缩放无法禁止的问题
移动端web缩放有两种: 1.双击缩放: 2.双指手势缩放. 在iOS 10以前,iOS和Android都可以通过一行meta标签来禁止页面缩放 <meta content="widt ...
- vue项目引入FastClick组件解决IOS系统下h5页面中的按钮点击延迟,连续点击无反应的问题
异常描述: ios系统手机中访问h5页面,按钮点击有延迟,连续点击卡顿.无反应. 异常原因: 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题:当时的网站都是为大屏幕设 ...
- ios系统微信浏览器、safari浏览器中h5页面上拉下滑导致悬浮层脱离窗口的解决方法
一. 运行环境: iphone所有机型的qq浏览器,safari浏览器,微信内置浏览器(qq浏览器内核)等. 二. 异常现象: 1. 大幅度上下滑动h5页面,然后停止滑动,有时候会影响到页面滚动,如局 ...
- H5页面手机端禁止缩放的正确方式
H5页面禁止手机端缩放是个常见问题了 首先说meta方式 <meta content="width=device-width, initial-scale=1.0, maximum-s ...
- h5页面ios,双击向上滑动,拖拽到底部还能继续拖拽(露出黑色背景)
h5页面ios,双击向上滑动,拖拽到底部还能继续拖拽 标签: 手机 2016-02-02 18:09 696人阅读 评论(0) 收藏 举报 在ios下,双击屏幕某些地方,滚动条会自动向上走一段. ...
- H5单页面手势滑屏切换原理
H5单页面手势滑屏切换是采用HTML5 触摸事件(Touch) 和 CSS3动画(Transform,Transition)来实现的,效果图如下所示,本文简单说一下其实现原理和主要思路. 1.实现原理 ...
随机推荐
- 借助 LVS + Keepalived 实现负载均衡
虽然现在云手段很高明了.但是这个lvs + keepalive 还是需要了解下的. 今天就整理了下lvs和keepalive的东西.做下总结留作以后怀念 在实际应用中,在Web服务器集群之前总会有一台 ...
- 024_mac配置屏保命令
注意吃饭等离开工位的时候养成随时开启屏保的功能,养成信息保护的好习惯,mac如何配置屏幕保护呢? 一. 通过mac"设置"里的"Desktop & Screen ...
- LibreOJ一本通题解报告
网页跳转 解析啥的以后会有的 目录 ·T1活动安排 ·T2种树 ·T3喷水装置 T1活动安排 /* problem:yibentong10000 date:2019/4/21 author:Lonel ...
- <A>标记onclick事件
<script> function ss() { document.getElementById("btnPublicity").click(); }</scri ...
- 从头开始学JAVA[Day01]
1.Java程序的执行过程必须经过先编译,后解释两个步骤 Jvm的统一标准,具体定义了JVM的如下细节: --指令集 --寄存器 --类文件格式 --栈 --垃圾回收堆 --存储区 2.编译Java程 ...
- 初学python之路-day10
基础部分先告一段落,今天开始学习函数. 一.函数:完成 特定 功能的代码块,作为一个整体,对其进行特定的命名,该名字就代表函数 -- 现实中:很多问题要通过一些工具进行处理 => ...
- jQuery-委托事件和on方法注册事件
delegate注册委托事件 delegate--代理.委托 事件代理----事件最终不是由$("#first")执行,它只是代理元素 第一个参数:最终发生事件的元素 第二个参数: ...
- foot
码云链接:https://gitee.com/zyyyyyyyyyyy/codes/rcfdzmin4a82v975pl1ko47 效果图: 原网站截图: 源代码: <!DOCTYPE html ...
- asp.net table/gridview 合并列
public void MergeCell(TableRow trow) { TableCell currentCell = trow.Cells[0]; TableCell prevCell = n ...
- eclipse中alt+/失效的几种解决方法
1.次方法用于没有一点提示的情况:依次打开eclipse上面的windows ——preferences ——java ——editor —— content assist ,在右上方有一行“sele ...