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. 异步流程控制库GoWithTheFlow

    异步流程控制库GoWithTheFlow 一个尾触发方式来控制异步流程的库, 有seq(顺序执行) par(同步执行) 两种方法 博客 http://notes.jetienne.com/2011/0 ...

  2. Oracle单个数据文件超过32G后扩容

    Oracle单个数据文件超过32G后扩容   表空间数据文件容量与DB_BLOCK_SIZE的设置有关,而这个参数在创建数据库实例的时候就已经指定.DB_BLOCK_SIZE参数可以设置为4K.8K. ...

  3. (12)Visual Studio 2012如何透过电子邮件部署Xamarin.Android App

    原文 Visual Studio 2012如何透过电子邮件部署Xamarin.Android App Android App在部署到实机的时候不像iOS的App限制你一定要使用向Apple申请的开发者 ...

  4. 微信公众号菜单openid 点击菜单即可打开并登录微站

    现在大部分微站都通过用户的微信openid来实现自动登录.在我之前的开发中,用户通过点击一个菜单,公众号返回一个图文,用户点击这个图文才可以自动登录微站.但是如果你拥有高级接口,就可以实现点击菜单,打 ...

  5. poj2608---几个字母映射到同一个数字

    #include <stdio.h> #include <stdlib.h> #include<string.h> ]={,,,,,,,,,,,,,,,,,,,,, ...

  6. 前端工程师须知pc电脑端分辨率

    PC端 按屏幕宽度大小排序(主流的用橙色标明) 分辨率   比例 | 设备尺寸 1024*500 (8.9寸) 1024*768 (比例4:3  | 10.4寸.12.1寸.14.1寸.15寸; ) ...

  7. 单页web应用开发流程

    用循环的视角审视Web应用开发 框定一个一致的SPA图形用户界面(GUI)和模型 将SPA的原则带回服务器端 聚集于对合适的应用进行早期SPA开发[3]  SPA协调的起点是认识到SPA与脚本和网页编 ...

  8. mysql字符集编码乱码测试如下

    创建三个表tb_latin1,tb_utf8,tb_gbk,编码分别为latin1/utf8/gbk “你好a”字符串编码如下GBK : %C4%E3 %BA%C3 %61UTF-8 : %E4%BD ...

  9. Android在应用中依据包名启动另外一个APP

    以下为TestIntentData工程 MainActivity如下: package cn.testintentdata; import java.util.List; import android ...

  10. HDU 1879 继续畅通工程 (Prim(普里姆算法)+Kruskal(克鲁斯卡尔))

    继续畅通工程 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Sub ...