fastclick.js插件使用简单说明
为什么存在延迟?
从点击屏幕上的元素到触发元素的 click
事件,移动浏览器会有大约 300 毫秒的等待时间。为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作。
引入插件步骤
①在HTML页面中添加
- <script type='application/javascript' src='/path/to/fastclick.js'></script>
注:必须在页面所有Element之前加载脚本文件先实例化fastclick
②在JS中添加fastclick的身体,推荐以下做法:
- if ('addEventListener' in document) {
- document.addEventListener('DOMContentLoaded', function() {
- FastClick.attach(document.body);
- }, false);
- }
如果你使用了JQuery,那么JS引入就可以改用下面的写法:
- $(function() {
- FastClick.attach(document.body);
- });
如果你使用Browserify或者其他CommonJS-style 系统,当你调用`require('fastclick')`时,`FastClick.attach`事件会被返回,加载FastClick最简单的方式就是下面的方法了:
- var attachFastClick = require('fastclick');
- attachFastClick(document.body);
fastclick.js插件使用简单说明的更多相关文章
- fastclick.js插件使用
引入插件步骤 ①在HTML页面中添加 <script type='application/javascript' src='/path/to/fastclick.js'></scr ...
- moment.js插件的简单上手使用
开发过程中看长篇幅的技术文档是件多么影响多发效率的事情丫,哼哼,人家明明只是想用个简单的功能而已丫,下面文档很好的解决了这个问题,yeah~~~ 一.monent.js时间插件 1.Moment.js ...
- 使用bootstrap的JS插件实现模态框效果
在上一篇文章中,我们使用 js+css 实现了模态框效果,在理解了模态框的基本实现方法和实现效果后,我们就要寻找更快捷的方法,又快又好的来完成模态框开发需求,从而节约时间,提高效率.一个好的轮子,不仅 ...
- JS 插件 fastclick.js 解决手机端click点击延迟
FastClick 是一个简单,易于使用的JS库用于消除在移动浏览器上触发click事件与一个物理Tap(敲击)之间的300延迟. 对于非移动浏览器不启作用,禁用缩放标签. <meta name ...
- fastclick.js介绍
原文地址:http://www.uedsc.com/fastclick.html 用途:去掉移动端click事件的300ms的延迟. 延迟为什么存在 …在移动浏览器中,当你点击按钮的单击事件时,将 ...
- 前端开发需要了解的JS插件
excanvas.js/Chart.js/cubism.js/d3.js/dc.js/dx.chartjs.js/echarts.js/flot.js 用途:构建数据统计图表,兼容多浏览器 jquer ...
- fastclick.js源码解读分析
阅读优秀的js插件和库源码,可以加深我们对web开发的理解和提高js能力,本人能力有限,只能粗略读懂一些小型插件,这里带来对fastclick源码的解读,望各位大神不吝指教~! fastclick诞生 ...
- 解决在移动端上 click事件延迟300 毫秒的问题 fastclick.js
1 为什么会发生延迟300毫秒的问题 移动设备上的浏览器默认会在用户点击屏幕大约延迟300毫秒后才会触发点击事件,这是为了检查用户是否在做双击.为了能够立即响应用户的点击事件,才有了FastClick ...
- 最牛的打字效果JS插件 typing.js
最新在做公司的一个项目,需要实现一个敲打代码的动画效果,粗意味比较简单,果断自己直接开写,写着写着发现是一个坑.需要支持语法高亮,并不能直接简单的用setTimeout来动态附件innerHTML.苦 ...
随机推荐
- CF954F Runner's Problem(DP+矩阵快速幂优化)
这题是一年前某场我参加过的Education Round codeforces的F题,当时我显然是不会的. 现在看看感觉应该是能做出的. 不扯了写题解: 考虑朴素的DP,在不存在障碍的情况下:f[i] ...
- (链表 双指针) leetcode 160. Intersection of Two Linked Lists
Write a program to find the node at which the intersection of two singly linked lists begins. For ex ...
- 设计模式--桥接(Bridge)模式
1.概述: 桥接模式:把抽象和行为分离开来,中间需要某个介质来连接抽象化和行为化.此模式的概述听起来非常像适配器模式,不要搞混了,虽然都是借用中间介质,但意义不同.最典型的桥接模式就是:JDBC.通过 ...
- MySQL常见报错汇总
1>.ERROR 1290 (HY000): The MySQL server is running with the --secure-file-priv option so it canno ...
- 使用git遇到的一些问题
上传github时忽略.DS_Store方法 这个文件在mac中是管理文件夹的位置之类的信息,所以并没有必要上传到git中,这个时候就需要用git.gitignore文件来忽略此类文件. 在默认情况下 ...
- C#设计模式(9)——代理模式
1.代理模式介绍 在软件开发中有时会遇到不能直接使用对象的问题,如我们要使用的对象在进程外,甚至在远程的机器上,但是我们要使用这个对象的功能怎么办呢?代理模式就可以用来解决这个问题.举一个生活中的例子 ...
- C# Selenium学习
https://blog.csdn.net/hjkl950217/article/details/54314760 https://www.cnblogs.com/vaevvaev/p/7041842 ...
- ACM-ICPC 2018 焦作赛区网络预赛 B Mathematical Curse(DP)
https://nanti.jisuanke.com/t/31711 题意 m个符号必须按顺序全用,n个房间需顺序选择,有个初始值,问最后得到的值最大是多少. 分析 如果要求出最大解,维护最大值是不能 ...
- Openresty 学习笔记(三)扩展库之neturl
github地址:https://github.com/golgote/neturl 最近在搞一个视频加密播放,中间使用要用lua 匹配一个域名,判断该域名是否正确 PS:使用PHP很好做,lua 的 ...
- 062、如何使用flannel host-gw backend(2019-04-02 周二)
参考https://www.cnblogs.com/CloudMan6/p/7457653.html flannel 支持多种backend,前面学习的是 vxlan backend ,host- ...