下载地址: fastclick.js

为什么存在延迟?

从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间。为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作。

1、引入fastclick.js 文件

  1. <script type='application/javascript' src='fastclick.js'></script>

2、调用方法

普通调用:

  1. window.onload = function() {
  2. FastClick.attach(document.body);
  3. }

jquery调用:

  1. $(function() {
  2. FastClick.attach(document.body);
  3. });

  

html 手机端click 事件延迟问题(fastclick.js使用方法)的更多相关文章

  1. html 手机端click 事件去掉黑色阴影效果

    添加css样式 html{-webkit-text-size-adjust: 100%;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);} 1.  -web ...

  2. 移动端click事件延迟300ms的原因以及解决办法

    这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的.于是苹果的工程师们做了一些约定,应对 iPhone 这种小屏幕浏览桌面端站点 ...

  3. 移动端click事件延迟300ms的原因以及解决办法[转载]

    原文:http://www.bubuko.com/infodetail-822565.html 这要追溯至 2007 年初.苹果公司在发布首款 iPhone 前夕,遇到一个问题 —— 当时的网站都是为 ...

  4. 移动端的click事件延迟触发的原理是什么?如何解决这个问题?

    移动端的click事件延迟触发的原理是什么?如何解决这个问题? 原理 :移动端屏幕双击会缩放页面 300ms延迟 会出现点透现象 在列表页面上创建一个弹出层,弹出层有个关闭的按钮,你点了这个按钮关闭弹 ...

  5. dedecms织梦手机端文章内容页图片不能自适应解决方法

    dedecms织梦手机端文章内容页图片不能自适应解决方法: 方法一修改手机端文章页模板代码: 找到并打开手机端的文章内容页模板,将里面的{dede:field.body/}标签修改一下,改为如下的标签 ...

  6. JS 插件 fastclick.js 解决手机端click点击延迟

    FastClick 是一个简单,易于使用的JS库用于消除在移动浏览器上触发click事件与一个物理Tap(敲击)之间的300延迟. 对于非移动浏览器不启作用,禁用缩放标签. <meta name ...

  7. 解决在移动端上 click事件延迟300 毫秒的问题 fastclick.js

    1 为什么会发生延迟300毫秒的问题 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击.为了能够立即响应用户的点击事件,才有了FastClick ...

  8. 移动端的传统click事件延迟和点透现象

    一.场景描述: 1.A/B两个层上下z轴重叠. 2.上层的A点击后消失或移开.(这一点很重要) 3.B元素本身有默认click事件(如a标签) 或 B绑定了click事件. 在以上情况下,点击A/B重 ...

  9. 移动端click事件延迟300ms到底是怎么回事,该如何解决?

    不管在移动端还是PC端,我们都需要处理用户点击,这个最常用的事件.但在touch端click事件响应速度会比较慢,在较老的手机设备上会更为明显(300ms的延迟). 问题由来 这要追溯至 2007 年 ...

随机推荐

  1. AC自动机-题目集合

    AC自动机-题目集合 模板 如果你想要学习AC自动机,推荐一些学习资料. 学习可以看这篇博客 http://blog.csdn.net/niushuai666/article/details/7002 ...

  2. java虚拟机内存溢出和泄漏实例

    测试参数设置: 1.循环调用new A()实现堆溢出,java.lang.OutOfMemoryError: Java heap space, 虚拟机参数:-Xms1M -Xmx1M -XX:+Hea ...

  3. JDBCTool

    新建 *.properties属性文件,内容如下: driver=com.mysql.jdbc.Driver url=jdbc:mysql://localhost:3306/dbName userna ...

  4. docker学习 (三) Windows 10 安装Docker

    Docker CE: 社区版,免费. Docker EE: 企业版,收费. 安装:             Windows 10 Pro 64, 必须开启Hyper-v 下载:Docker for W ...

  5. Cannot resolve symbol 'log'

    IntelliJ IDEA 写实体类时使用toString报错,报异常: 原因:缺少commons-lang3-3.8.1.jar包. 下载路径:http://commons.apache.org/p ...

  6. linux之打包压缩命令

    tar:主选项:[一条命令以下5个参数只能有一个]-c: --create 新建一个压缩文档,即打包-x: --extract,--get解压文件-t: --list,查看压缩文档里的文件目录-r:- ...

  7. 技术胖Flutter第四季-21导航的参数传递和接受-2

    21导航的参数传递和接受-2 视频地址 https://www.bilibili.com/video/av35800108/?p=22 博客地址:https://jspang.com/post/flu ...

  8. CCF 201509-2 日期计算 (水题)

    问题描述 给定一个年份y和一个整数d,问这一年的第d天是几月几日? 注意闰年的2月有29天.满足下面条件之一的是闰年: 1) 年份是4的整数倍,而且不是100的整数倍: 2) 年份是400的整数倍. ...

  9. HDU5880【AC自动机】

    题意: 给出n个字符串,再给出一个字符串,把之前出现过的字符串全部变成* 思路: AC自动机,Trie树上存的值是一个字符串的长度,也就是往前的长度,然后倒着处理一遍. 感想: 第三题AC自动机,本来 ...

  10. POJ3264 【RMQ基础题—ST-线段树】

    ST算法Code: //#include<bits/stdc++.h> #include<cstdio> #include<math.h> #include< ...