解决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.实现原理 ...
随机推荐
- 秋名山老司机(BS4与正则的比拼)
因为嘉伟思杯里的一个脚本题目,16进制计算,python3正则还没学,所以没写出来.大佬跟我说也可以用BS4,从DOM上下手,直接爬下来直接一个eval就搞定了,eval可以像这样计算16进制,eva ...
- git/gerrit的简介
gerrit和git 1.git Git是什么? Git是目前世界上最先进的分布式版本控制系统. SVN是集中式版本控制系统. Git与svn比较 相同:能记录文件的所有更改记录.这样是为了大量更 ...
- Linux小知识收集(不断更新)
一.说明 以下知识点都来自网络收集,只是给自己记录以免下次同样的问题的时候会忘记,如果知道出处,我都会进行标注,如果侵权的话,请邮件通知我,我会及时删除的 二.知识点 1.将centos的源修改为阿里 ...
- [转载 java 技术栈] eclipse 阅读跟踪 Java 源码的几个小技巧!
本文基于Eclipse IDE,我们每天都使用的IDE其实提供了很多强大的功能,掌握它们,往往能够事半功倍. 1.Quick Type Hierarchy 快速查看类继承体系. 快捷键:Ctrl + ...
- MySQL查看所有连接的客户端ip
) AS host_name,state,count(*) FROM information_schema.processlist GROUP BY state,host_name;
- CollectionUtils工具类的常用方法
集合判断: 例1: 判断集合是否为空: CollectionUtils.isEmpty(null): true CollectionUtils.isEmpty(new ArrayList()): t ...
- [原创]SecureCRT终端软件连接VMware Workstation Pro虚拟机
Step1:检查主机的桥接有没有禁用 Step2:进入Ubuntu系统,进入到Ubuntu下,先查看Ubuntu虚拟机的IP配置,打开终端(Ctrl+Alt+T),通过ifconfig命令查看,可以看 ...
- centos 7.5+如何格式化硬盘
[root@k8s-node2 ~]# fdisk -l Disk /dev/sdb: bytes, sectors Units = sectors of * = bytes Sector size ...
- 16 道嵌入式C语言面试题
1. 用预处理指令#define 声明一个常数,用以表明 1 年中有多少秒(忽略闰年问题) #define SECONDS_PER_YEAR (60 * 60 * 24 * 365)UL 我在这想看到 ...
- Netty5客户端源码解析
Netty5客户端源码解析 今天来分析下netty5的客户端源码,示例代码如下: import io.netty.bootstrap.Bootstrap; import io.netty.channe ...