Hammer js——移动设备触摸手势

AI权益加码!Claude Code、Cursor等20+工具免费用! 购周边限时加赠Coding Plan Lite,畅享主流AI工具!学习进阶更高效! 阅读详情
               



简介

Hammer.js是一个轻量级的JavaScript库(仅有2kb),能让你的网站轻松实现触控事件。它依赖于jQuery,用来控制触摸设备上的多点触控特性。并支持以下特性:

  • Tap
  • Double Tap
  • Hold
  • Drag
  • Transform

兼容性

Hammer.js已经在IOS5系统的iPad1,IOS5系统的iPhone,Android 2.3.3的三星Galaxy S以及Goolge Chrome 17测试可用。在桌面浏览器上鼠标能够模拟单个手指的触控事件。在Android 2与3 默认的浏览器以及FireFox 10不支持多点触控事件,所以在Android,FireFox 1.1(Nokia N900)上没有transform。Windows Phone 7.5不支持触摸事件,mouse event支持也很糟糕。


</

APP开发_Hammer.js 触摸事件处理库教程 Hammer.js 触摸事件处理库教程 阅读详情

相关推荐

使用Hammer.js操作svg

hammer.js 是一个支持多手势操作的库,可以绑定dom元素,同时监听单击、双击、放缩、长按、滑动、旋转等事件。官网地址: https://hammerjs.github.io/在我参与的某个项目开发中,需要实现对svg图形的绘制以及各种手势操作的监听,使用 hammer.js 很大程度的提高了开发的效率。首先在html中加入svg:<!DOCTYPE html> <html> <head>

Chouglas的专栏 1536

Hammer.js - 旋转 拖拽 移动 缩放

Hammer.js 旋转 拖拽 移动 缩放

cc蒲公英的博客 6782

hammerjs移动端手势放大或移动图片

基于angular的项目引入hammerjs手势操作。 1、首先下载npm install hammerjs 2、在main.ts引入import ‘hammerjs’; 3、在app.module.ts对手势进行配置; import {HammerGestureConfig, HAMMER_GESTURE_CONFIG} from '@angular/platform-browser'; export class MyHammerConfig extends HammerGestureConfig

qq_31392495的博客 1205

页面控制--移动端开发手势Hammer.JS使用文档

Hammer.js是一个轻量级的触屏设备的手势插件库,它能帮我们识别出在移动端开发过程中遇到的触摸,拖动,长按,滑动,手指平移,双指捏拿缩放等常见的用户手势操作.Hammer.js不需要依赖任何JS库,并且它的体积较小,生产环境的Hammer.js体积为7.34KB.Hammer.js官网地址正式版:开发版:Github源码地址:Harmmer可以运行在除了IE8-的任何地方。浏览器若对触摸行为(touch-action)提供原生支持,那么对比那些不支持的浏览器,会有更好的体验。可通过查看页面了解更多。

qq_45321489的博客 3212

js 移动开发框架:Hammer.js 移动设备触摸手势js

hammer.js是一个多点触摸手势库,能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件,免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器,在桌面浏览器上,也能将鼠标的点击当做触摸,方便开发人员在桌面浏览器上调试。这是一个专为触摸手势而生的js...

编程哲学家的专栏 494

Hammer.js——移动设备触摸手势

简介 Hammer.js是一个轻量级的JavaScript库(仅有2kb),能让你的网站轻松实现触控事件。它依赖于jQuery,用来控制触摸设备上的多点触控特性。并支持以下特性: TapDouble TapHoldDragTransform 兼容性 Hammer.js已经在IOS5系统的iPad1,IOS5系统的iPhone,Android 2.3.3的三星Ga

cc蒲公英的博客 7933

Hammer.js 移动设备触摸手势js

hammer.js是一个多点触摸手势库,能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件,免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器,在桌面浏览器上,也能将鼠标的点击当做触摸,方便开发人员在桌面浏览器上调试。这是一个专为触摸手势而生的j

HTMl5自由者 5507

【亲测免费】 Hammer.js 使用教程

Hammer.js 是一个轻量级且强大的JavaScript库,专注于手势识别。它允许开发者轻松地在网页上添加多点触控和鼠标触摸事件处理。自2011年由Eight Media推出以来,Hammer.js已成为响应式设计和交互优化中不可或缺的工具之一,尤其适用于移动设备触摸屏界面。通过这个库,开发人员可以实现滑动、点击、双击、拖拽等多种手势操作,极大丰富了用户的交互体验。 ## 项目快速启动 ...

gitblog_00703的博客 894

hammer.js - 一款轻量级的触摸事件处理库

Hammer.js 是一个轻量级的 JavaScript 库,主要用于处理移动设备上的触摸事件,提供了一种简单易用的方式来创建复杂的触摸交互体验。 ## 能用来做什么? 使用 Hammer.js 可以方便地实现以下功能: 1. **手势识别**:支持多种手势,包括滑动(swipe)、拖拽(drag)、双指缩放(pinch)等。 2. **防抖与节流**:内置了防抖(debounce)和节流(...

gitblog_00042的博客 1149

移动开发框架,Hammer.js 移动设备触摸手势js

原文:https://www.cnblogs.com/zhwl/p/3525238.htmlhammer.js是一个多点触摸手势库,能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件,免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器,在桌面浏览器上...

facing-screen's blog 412

移动开发框架,第【二】弹:Hammer.js 移动设备触摸手势js

hammer.js是一个多点触摸手势库,能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件,免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器,在桌面浏览器上,也能将鼠标的点击当做触摸,方便开发人员在桌面浏览器上调试。这是一个专为触摸手势而生的js...

weixin_33757609的博客 334

移动开发框架,第【二】弹:Hammer.js 移动设备触摸手势js

【原创】作者:一只猿 原文地址:http://www.92ez.com 转载请注明出处,谢谢 hammer.js是一个多点触摸手势库,能够为网页加入Tap、Double Tap、Swipe、Hold、Pinch、Drag等多点触摸事件,免去自己监听底层touchstart、touchmove、touchend事件并且写一大堆判断逻辑的痛苦。hammer.js不但支持触摸屏设备的浏览器,在桌面...

weixin_30367543的博客 89

头像裁剪

<!doctype html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <met...

weixin_30673611的博客 111

html5手势插件,支持移动设备触摸手势的jQuery图片裁剪插件

jQuery-photoClip是一款支持移动设备触摸手势的图片裁剪jQuery插件。该图片裁剪插件在移动设备上可以使用手指来进行各种操作,如缩放、旋转等,同时在桌面设备中也提供了相应的方法来操作,是一款非常不错的图片裁剪插件。使用方法操作方法在移动设备上双指捏合为缩放,双指旋转可根据旋转方向每次旋转90度。在PC设备上鼠标滚轮为缩放,每次双击则顺时针旋转90度依赖该图片裁剪插件依赖于iscrol...

weixin_39994438的博客 236

AriaNg移动手势冲突解决:触摸操作优化

你是否在手机上使用AriaNg时遇到过这些问题:滑动任务列表时误触了暂停按钮、想左右切换标签页却触发了下拉刷新、长按菜单与任务选择功能相互干扰?这些典型的触摸操作冲突,正在严重影响移动用户的下载管理体验。 AriaNg作为一款现代化的Aria2 Web前端,虽然在桌面端表现出色,但在移动设备上的交互体验却存在明显短板。本文将深入分析移动手势冲突的底层原因,提供一套完整的检测、分析与解决方案,帮助...

gitblog_00471的博客 897

移动端事件库

Touch.js Touch.js移动设备上的手势识别与事件库, 由百度云Clouda团队维护,也是在百度内部广泛使用的开发工具.(已停更) Touch.js手势库专为移动设备设计,是Web移动端touch点击事件不错的解决方案 GitHub - Clouda-team/touchjs: Touchjs getsture library 用法: 示例: hammer.js 一款开源的移动端脚本框架,他能完美的实现在移端开发的大多数事件,如点击、滑动、拖动、多点触...

PengHengYYDS的博客 181

移动端 事件

https://www.cnblogs.com/QRL909109/p/6166250.html hammer.js中文文档 转载于:https://www.cnblogs.com/blccy/p/8201986.html

weixin_33735077的博客 107
上一篇: photoswipe js——移动端图片文字放大缩小
下一篇: flex上下固定中间滚动布局
有水有房子
博客等级 码龄8年 51粉丝 154原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值