js触摸事件 应用在移动端 webkit内核都支持。

  触摸事件api https://dvcs.w3.org/hg/webevents/raw-file/tip/touchevents.html

  事件:

  1.touchstart:  // 手指放到屏幕上的时候触发 
    2.touchmove:  // 手指在屏幕上移动的时候触发 
    3.touchend:  // 手指从屏幕上拿起的时候触发 
    4touchcancel:  // 没测试过  。系统取消touch事件的时候触发。至于系统什么时候会取消,不详

  

  ev.preventDefault(); //阻止默认事件  

经常在写给某个dom对象加了touch时间以后 写了 ev.preventDefault 还是 有滚动条。 所以给 document加上会阻止掉。

触摸时 阻止页面滚动   document.addEventListener("touchmove",function(e){  e.preventDefault(); },false);

触摸事件库  hammer.js    http://eightmedia.github.io/hammer.js/

  这个库支持很多手势。

  tap     drag   swipe  rotate

还自己定义了很多手势 比如  左滑动 swipeleft  右滑动 swiperight

var oCube = document.getElementById('viewport');

        var hammertime = Hammer(oCube).on("swipeleft", function(event) {

            alert('aa');
event.stopPropagation();
event.preventDefault(); });

  

js 触摸事件的更多相关文章

  1. 移动端-js触摸事件

    开发者工具 在移动开发中,一种较为容易的做法是,先在桌面上开始原型设计,然后再在打算要支持的设备上处理移动特有的部分.多点触摸正是难以在PC上进行测试的那些功能之一,因为大部分的PC都没有触摸输入. ...

  2. 移动端JS 触摸事件基础

    一.手机上的触摸事件   基本事件:   touchstart   //手指刚接触屏幕时触发 touchmove    //手指在屏幕上移动时触发 touchend     //手指从屏幕上移开时触发 ...

  3. 移动端js触摸事件大全

    一.手机上的触摸事件 基本事件: touchstart   //手指刚接触屏幕时触发 touchmove    //手指在屏幕上移动时触发 touchend     //手指从屏幕上移开时触发 下面这 ...

  4. js触摸事件

    touch事件的绑定 电脑端的mouseDown,mouseUp,mouseMove分别对应移动端的touchstart,touchend,touchmove 下面的代码判断浏览器是电脑端还是移动端, ...

  5. js 触摸事件 touch

    //ban 为某div let startX = 0; ban.addEventListener("touchstart",function(){ //获取初始点击位置 start ...

  6. 移动web开发,12个触摸及多点触摸事件常用Js插件

    如今移动互联网已经占据了主流地位,越来越多的开发者开始从桌面转向移动平台.与桌面开发不同的是,在移动领域中,不同的操作系统.大量不同屏幕尺寸的移动设备.触摸手势操作等,这都给开发者带来了一定的难度和挑 ...

  7. <WEB>平板_手机开发_13 个处理触摸事件和多点触摸的JS 库

    触摸屏是现在所有智能手机的标配,还包括各种平板设备,而且很多桌面也慢慢在开始支持触摸操作.要开发支持触摸屏设备的 Web 应用,我们需要借助浏览器的触摸事件来实线. 下图是各种触摸事件说明: 本文我们 ...

  8. ios实例开发精品文章推荐(8.12)11个处理触摸事件和多点触摸的JS库

    11个处理触摸事件和多点触摸的JS库 触摸屏是现在所有智能手机的标配,还包括各种平板设备,而且很多桌面也慢慢在开始支持触摸操作.要开发支持触摸屏设备的Web应用,我们需要借助浏览器的触摸事件来实现. ...

  9. JS事件监听手机屏幕触摸事件 Touch

    JS移动客户端--触屏滑动事件 移动端触屏滑动的效果其实就是图片轮播,在PC的页面上很好实现,绑定click和mouseover等事件来完成.但是在移动设备上,要实现这种轮播的效果,就需要用到核心的t ...

随机推荐

  1. atoi函数和atof函数

    1.函数名:atoi 功能:是把字符串转换成整型数的一个函数,应用在计算机程序和办公软件中 名字来源:alphanumeric to integer 用法:int atoi(const char *n ...

  2. Combotree,datebox 启用 禁用

    combotree <input type="checkbox" id="ckMonitor"></input> <input i ...

  3. C++ string实现原理

    C++程序员编码过程中经常会使用string(wstring)类,你是否思考过它的内部实现细节.比如这个类的迭代器是如何实现的?对象占多少字节的内存空间?内部有没有虚函数?内存是如何分配的?构造和析构 ...

  4. poj2583---Series Determination

    #include <stdio.h> #include <stdlib.h> int main() { int x,y,z,a,b,c; while(scanf("% ...

  5. poj1665

    #include <stdio.h> #include <stdlib.h> #define pi 3.1415926 int main() { float dia,tim; ...

  6. New Relic——手机应用app开发达人的福利立即就到啦!

    HiWork集成的第三方服务(机器人)将有新的添加啦,添加了BitBucket和New Relic.分别做下介绍啦! 1.BitBucket BitBucket 是一家源码托管站点.採用Mercuri ...

  7. Flash,EEPROM差别

    flash是用来存储代码的,在执行过程中不能改:EEPROM是用来保存用户数据,执行过程中能够改变,比方一个时钟的闹铃时间初始化设定为12:00,后来在执行中改为6:00,这是保存在EEPROM里,不 ...

  8. 【Android进阶学习】shape和selector的结合使用

    shape和selector是Android UI设计中经常用到的,比如我们要自定义一个圆角Button,点击Button有些效果的变化,就要用到shape和selector.可以这样说,shape和 ...

  9. Objective-C内存管理教程和原理剖析(四)

    初学Objective-C的朋友都有一个困惑,总觉得对Objective-C的内存管理机制琢磨不透,程 序经常内存泄漏或莫名其妙的崩溃.我在这里总结了自己对Objective-C内存管理机制的研究成果 ...

  10. IOS7 position:fixed 定位问题

    在IOS7下position:fixed定位会出一些bug. 输入框 focus 状态下 fixed会随之改变.参见该页面详细描述(http://www.cnblogs.com/zhangdaipin ...