移动端项目 添加 触屏 swipe事件[记录]

 

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>

avalon 触屏 事件 

  tap, longtap, doubletap
  swipe, swipeleft, swiperight,swipedown,swipeup
  pinch, pinchstart,pinchend,pinchin,pinchout
  drag,dragstart,dragend,
  rotate,rotatestart,rotateend

移动端 触屏事件添加 测试  (https://segmentfault.com/a/1190000006012676)

  挑选用到的模块加 例如  swipe  ----  require 进入

  ms-on-swipe="@fn" (@fnTest($event))

  fn: function(e){ console.log(e) }

  fnSwipeLeft:function(e){ if(e.originalEvent.direction=="left") mstestTouch.swipeLeftFn(e); },

  slideWrap.style.left =-(index+1)*100+"%";

移动端 双击  (两个单击 时间<0.5)

  var backSecond = 0;

  var curSecond = new Date().getSeconds();
  if (Math.abs(curSecond - backSecond) > 0.5) {
    backSecond = curSecond;
  } else {
    this.isDoubleClick="双击666";
    setTimeout(function () {
      mstestTouch.isDoubleClick="点击我进行双击";
    },1500);
  }
  //禁止事件冒泡
  event.stopPropagation();

  

移动端 点击问题

  网页端 用 ms-on-click

  手机端 用 ms-on-tap (tap 代替 click )click会不好用  

  自己写的双击出问题  暂时  添加a 

    <li><a href="javascript:void(0)" ms-on-tap="@fnDoubleClick($event)">手势手机a--{{@isDoubleClick}}</a></li>

移动端 延迟300秒问题

  禁止缩放 viewport

 

avalon获取所操作的该元素

  <li ms-on-tap="@fnSwipeLeft">向左滑动,显示下一页</li>

  fnSwipeLeft: function(e) {var target = e.target;}

转载于:https://www.cnblogs.com/caiCheryl/p/7512527.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值