首页
学习
活动
专区
圈层
工具
发布

移动端手势的七个事件库

是轻量级模块化、面向对象的JavaScript库,定义了多种触摸手势,可以用于移动Web开发中简化HTML文件遍历、事件处理及Ajax交互等,让开发者轻松编写出高效的跨浏览器代码。...jQueryMobile适用于所有流行的智能手机和平板电脑,jQuery Mobile是jQuery框架的一个组件(而非jquery的移动版本)。...jQuery Mobile是一款基于HTML5的用户界面系统,旨在使所有智能手机,平板电脑和桌面设备上都可以访问的响应网站和应用。...jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架。...专业版都是压缩的JS、CSS,基本不能阅读代码如果到期基本就不可以再免费使用了。

5.2K40

Touch 移动设备上的 手势识别 与 Js事件库

移动端touch点击事件不错的解决方案,搭配zepto.js或者jQuery使用起来解决了移动端click点击事件300ms的延迟问题。...滑动手势终点 ~ swipeleft 向左滑动 ~ swiperight 向右滑动 ~ swipeup 向上滑动 ~ swipedown 向下滑动 ~ swipe 滑动 拖动开始 dragstart 拖动屏幕...拖动 drag 拖动手势 拖动结束 dragend 拖动屏幕 拖动 drag 拖动手势 长按 hold 长按屏幕 敲击 tap 单击屏幕 ~ doubletap 双击屏幕 事件代理 touch.on...具体参数说明,同“事件代理”方法中的“types”参数说明。 callback function 事件处理函数,具体参数说明,同“事件代理”方法中的“callback”参数说明。...具体参数说明,同“事件代理”方法中的“callback”参数说明。

4.8K40
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    前端常用插件

    插件 parallel.js: 前后端通用的一个并行库 zepto: 用于现代浏览器的兼容 jQuery 的库 totoro: 稳定的跨浏览器测试工具 TheaterJS: 一个用于模拟人输入状态的 JS...: 用于 Javascript 中的多行文本,类似于 Ruby 的 HERE Doc screenfull.js: 全屏插件,支持各大浏览器 lunr.js: 类似于 Solr, 但是用于浏览器上的全文搜索引擎...border-width 和 background-position 实现的各种动态效果,看真相 Fluidbox: 页面上内嵌图片的放大缩小效果,类似于 Medium 中的效果 jquery-validation...定位、运动、倾斜等 hyhyhy: 用于创建 基于 HTML5 的 演示文稿 swipebox: jQuery 插件,用于处理移动端的触摸事件 FileAPI: 前端用户处理文件(拖放、多文件上传等)...版的 Firefox jquery-mobile: jQuery 团队开发的用于辅助手机端 web app 开发的库,基于 HTML5 mobile-angular-ui: 基于angularjs和bootstarp

    5.4K61

    Airtest跨平台的UI自动化测试框架(一)

    ;例如,touch((200,500),times=2),表示双击x为200,y为500的位置点,默认双击事件为0.01秒; 长按:touch((x, y),duration=duration),duration...名称为“sogou.mobile.explorer.hmct:id/ff”的控件; 注释:resourceId控件名称通常前面包含“r”,但是在点击时要去掉;获取设备坐标可以利用手机的开发者模式中的【显示触摸位置...:swipe中的steps默认为5,但是实践证明,对于用户教育页的场景,至少得10秒,因此为了保险起见,建议赋值10。...3、文本输入 Airtest文本输入Api为text(“文本信息”,enter = False,search=True),第一个参数为输入的文本信息;第二个和第三个类似,均为自动搜索,相当enter,可以不写...例如,小编代码结构存在Common.py,在业务类中调用Common.py中的函数,可以如下操作: ? ⑤ 对于控件元素有雷同的如何处理。

    2.3K40

    Android测试工具 UIAutomator入门与介绍

    ---- 优点:可以对所有的操作来进行自动化,操作简单(eg:点击事件 ,侧滑事件,上拉事件,以及模拟键盘输入测试用例)。可以测试所有设备的程序。...您可以使用这些 API 在多个应用间捕获和操纵界面组件: UiCollection:枚举容器的界面元素,目的是为了计数,或者按可见文本或内容说明属性来定位子元素。...UiObject:表示设备上可见的界面元素。 UiScrollable:支持搜索可滚动界面容器中的项目。...(File dest) // dump当前的层次化结构到文件中 void dumpWindowHierarchy(OutputStream out) // dump当前的层次化结构到流中 void...boolean setText(String text) // 设置输入内容 boolean swipeDown(int steps) // Performs the swipe down action

    2K20

    touch.js的使用总结

    选择器 types  string 事件的类型(多为手势事件),可接受多个事件以空格分开;支持原生事件的透传 callback    function  事件处理函数, 移除函数与绑定函数必须为同一引用...向右旋转 rotate旋转 3、滑动 swipestart滑动手势起点 swiping滑动中 swipeend滑动手势终点 swipeleft向左滑动 swiperight向右滑动 swipeup向上滑动...swipedown向下滑动 swipe滑动 4、拖动 拖动开始    dragstart拖动屏幕 拖动           drag拖动手势 拖动结束     dragend拖动屏幕 5、长按 hold...direction操作的方向属性 fingersCount操作的手势数量 position相关位置信息, 不同的操作产生不同的位置信息 distance               swipe类两点之间的位移...rotate事件触发时旋转的角度 duration                  touchstart 与 touchend之间的时间戳 factor             swipe事件加速度因子

    2K10

    从零开始学 Web 之 移动Web(五)touch事件的缺陷,移动端常用插件

    一、touch事件的缺陷 我们在上面《页面分类》的项目中,对 tap 事件的处理使用的是 touch 事件处理的,因为如果使用 click 事件的话,总会有延时。...即使平台本身提供的滚动已经很不错,iScroll可以在此基础上提供更多不可思议的功能。具体来说: 细粒度控制滚动位置,甚至在滚动过程中。你总是可以获取和设置滚动器的x,y坐标。... 2、在 script 标签中初始化 iScroll。...script 中进行初始化操作: window.mySwipe = Swipe(document.getElementById('slider')); 4、如果你想要自动轮播,滑动等操作,需要在初始化的第二个参数中...使用说明: 参考链接:http://www.swiper.com.cn/usage/index.html 需要注意的是,swiper 不同于 swipe,它也是结构固定,不限标签的,唯一的区别是类样式的名称是不可改变的

    3.4K20

    jquery mobile 移动web(6)

    jquery mobile 针对移动端设备的事件类型。   1.touch 事件。     tap 快速触摸屏幕并且离开,类似一种完整的点击操作。     ...swipe 在1秒内水平移动30px屏幕像素上时触发。     swipeleft 向左侧滑动     swiperight 像右侧滑动。   ...vmousecancel 统一处理触摸和鼠标l离开事件。 页面视图辅助工具   1. $.mobile.changePage     通过函数编程的方式改变两个视图之间切换效果。...地址的协议,如 http https       属性:search 说明:返回地址中“?”...属性:password 说明:返回请求URL 中的密码 如ftp 协议密码。       属性: username 说明:返回请求URL中的用户名,如ftp 协议的用户名。

    1.6K100

    jQuery幻灯片插件slick

    简介 slick 是一个基于 jQuery 的幻灯片插件,具有以下特点: 支持响应式 浏览器支持 CSS3 时,则使用 CSS3 过度/动画 支持移动设备滑动 支持桌面浏览器鼠标拖动 支持循环 支持左右控制...jQuery兼容:兼容 1.7 及以上版本。...cssEase 字符串 ‘ease’ CSS3 动画 customPaging function n/a 自定义分页 dots 布尔值 false 指示点 draggable 布尔值 true 启用桌面拖动...onAfterChange(this, index) method null 切换后的回调函数 onInit(this) method null 第一次初始化后的回调函数 onReInit(this)...’ 滑动元素查询 slidesToShow 整数 1 幻灯片每屏显示个数 slidesToScroll 整数 1 幻灯片每次滑动个数 speed 整数 300 滑动时间 swipe 布尔值 true 移动设备滑动事件

    3.8K30

    vue3打造接近原生体验的抽屉指令

    当我们使用了简单的抽屉体验之后,大家就会发现,抽屉中一旦有滚动条就歇菜了,滚动条会和拖动事件冲突, 那么怎么办呢?...其实,细想一下,我们就可以发现,我们可以判定滚动条是否已经到顶部,当滚动条不在顶部的时候,我们就关闭拖动事件,当他在顶部的时候,我们就开启 这样一来,就可以将滚动和拖动事件,变成相当于单线程的事件,判断代码如下...我们知道,在web页面中,由于频繁的操作dom会引起页面的卡顿,大家通识的优化方案有两个 1、节流函数,节制事件的触发评率 2、利用requestAnimationFrame函数优化性能 别急我们一个个分析...理论上来说,节流函数,其实是最优的选择,将事件的触发频率降低,那么操作dom频率就会降低,从而解决性能问题,在辅以requestAnimationFrame函数 可谓巧夺天工 然而,在实际的使用过程中...,拖动抽屉的时候,在粗鲁之辈的暴力测试中,由于节流函数的限制,他却不跟手,性能是好了,体验却极差 这是两瓶毒药啊?

    59430
    领券