返回介绍

saber-tap v0.1.0-0

发布于 2023-10-15 20:10:06 字数 1288 浏览 0 评论 0 收藏 0

saber-tap

一个让移动端支持无延迟点击的小模块,基于 FastClick

This project is forked from ftlabs/fastclick

Precondition

使用 saber-tap 之前需要满足下列前提:

  • viewport 必须设置了 user-scalable=no
  • 只支持使用 webkit 内核的手机、平板设备浏览器

Usage

在满足以上 前提 时:

通过 edp 引入模块:

edp import saber-tap

然后:

// 引入 `saber-tap` 模块
var Tap = require( 'saber-tap' );

// 特定范围内应用无延迟点击,传入DOM元素或id
Tap.mixin( 'container' );

// 若想全局应用,可在 `domready` 时传入 `body`
window.addEventListener( 'load', function() {
    Tap.mixin( document.body );
});

// 搞定之后绑定的 click 事件就没有延迟了
el.addEventListener( 'click', clickHandler );

因为 Tap 会在给定的 layer 上使用事件委托,为防止大范围的 tap-highlight 效果,推荐加上如下样式:

body {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

局部使用可将 body 换为对应的 layer

API

.mixin( layer )

将 layer 元素内的点击事件换为无延迟点击。

参数 layerDOM元素 <HTMLElement>DOM元素的id <string>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文