touch事件总结
$("body").on("touchstart", function(e) {
e.preventDefault();
startX = e.originalEvent.changedTouches[0].pageX,
startY = e.originalEvent.changedTouches[0].pageY;
});
$("body").on("touchmove", function(e) {
e.preventDefault();
moveEndX = e.originalEvent.changedTouches[0].pageX,
moveEndY = e.originalEvent.changedTouches[0].pageY,
X = moveEndX - startX,
Y = moveEndY - startY;
if
( X > 0 ) {
alert("left 2 right");
}
else
if ( X < 0 ) {
alert("right 2 left");
}
else
if ( Y > 0) {
alert("top 2 bottom");
}
else
if ( Y < 0 ) {
alert("bottom 2 top");
}
else{
alert("just touch");
}
});
touch事件总结的更多相关文章
- UC浏览器中touch事件的异常记录
以前也在UC上面栽过几个坑,不过都是页面显示方面的.上个周的时候,商品详情页重做,要添加个上拉显示详情的效果. 有两个条件需要判断: 1.是否到达底部: 2.到达底部之后拖动的y轴距离. 效果写完后, ...
- 移动端开发概览【webview和touch事件】
作为一个前端,而且作为一个做移动端开发的前端,那意味着你要有三头六臂,跟iOS开发哥哥一起打酱油,跟Android开发哥哥一起修bug... Android vs Ios 我在webkit内核的chr ...
- 手持设备点击响应速度,鼠标事件与touch事件的那些事
前言 现在一直在做移动端的开发,这次将单页应用的网页内嵌入了app,于是老大反映了一个问题:app应用点击响应慢!我开始不以为然,于是拿着网页版的试了试,好像确实有一定延迟,于是开始了研究,最后选择了 ...
- 第六课 touch事件
1.移动端页面在PC上浏览时,限制宽度的方法: 2.移动端页面切换设备时自动刷新页面的方法: 3.touch事件 touchstart:当手指触摸屏幕时触发.通过addEventListener添加移 ...
- 原生js移动端touch事件实现上拉加载更多
大家都知道jQuery里没有touch事件,所以在移动端使用原生js实现上拉加载效果还是很不错的,闲话不多说,代码如下: //获取要操作的元素 var objSection = document.ge ...
- js的touch事件的实际引用
一开始做前端页面的时候,接触的也是js,但是随后便被简单高效的jquery吸引过去,并一直使用至今. 而js,则被我主观的认为底层技术而抛弃. 直到这几天工作需要,研究移动端页面的触屏滑动事件,搜索j ...
- H5中的touch事件
touch中共有touchstart.touchmove和touchend三个事件: touchstart:触摸开始的时候触发 touchmove:手指在屏幕上滑动的时候触发 touchend:触摸结 ...
- javascript移动设备Web开发中对touch事件的封装实例
在触屏设备上,一些比较基础的手势都需要通过对 touch 事件进行二次封装才能实现.zepto 是移动端上使用率比较高的一个类库,但是其 touch 模块模拟出来的一些事件存在一些兼容性问题,如 ta ...
- Android Touch事件传递机制 二:单纯的(伪生命周期)
转载于:http://blog.csdn.net/yuanzeyao/article/details/38025165 在前一篇文章中,我主要讲解了Android源码中的Touch事件的传递过程,现在 ...
- Android Touch事件传递机制 一: OnTouch,OnItemClick(监听器),dispatchTouchEvent(伪生命周期)
ViewGroup View Activity dispatchTouchEvent 有 有 有 onInterceptTouchEvent 有 无 无 onTouchEvent 有 有 有 例 ...
随机推荐
- win7 失去焦点解决方案
将HKEY_CURRENT_USER\Control Panel\Desktop中的ForegroundLockTimeout的选项,改成十进制的200000毫秒或者十六进制30d40. 参考链接: ...
- SQL笔记:中级篇
1.LIMIT 查询前多少条数据 例如:查询user表前三条数据 SELECT * FROM user LIMIT 3 ORACLE: SELECT name FROM user WHERE RO ...
- MVC5手工添加System.Web.Optimization
VS2012web手工添辑一个空的mvC5的项目,添加EF6的支持,在别的项目里复制了母版页_Layout.cshtml过来,发现Styles.Render未引用,这个引用使用的命名空间是System ...
- NPOI导出EXCEL部分样式不起作用
在使用NPOI导出excel的时候,设置cell样式,数据量多余6条之后,在后面几条数据没有样式(边框,对其,换行等). 原因是设置CellStyle的时候把CreateCellStyle放在循环列集 ...
- nginx配置同一域名下,共存2个nodejs项目
项目背景: 1.官网需要改版,使用nodejs nuxt框架进行重构 2.官网改版没有全部完成.但需要上线首页 项目需求: 1.让首页内容显示为新项目 2.让老官网的内容可以被访问到(比如www.n. ...
- HierarchyId通过父节点创建一个新的子节点
--HierarchyId通过父节点创建一个新的子节点 CREATE TABLE #temp( node HierarchyID ); insert into #temp select '/' uni ...
- C - Trailing Zeroes (III)(二分)
You task is to find minimal natural number N, so that N! contains exactly Q zeroes on the trail in d ...
- 洛谷P1282 多米诺骨牌
P1282 多米诺骨牌 题目描述 多米诺骨牌有上下2个方块组成,每个方块中有1~6个点.现有排成行的 上方块中点数之和记为S1,下方块中点数之和记为S2,它们的差为|S1-S2|.例如在图8-1中,S ...
- mysql安装等操作
CentOS 6.5系统中安装配置MySQL数据库 卸载掉原有mysql rpm -qa | grep mysql // 这个命令就会查看该操作系统上是否已经安装了mysql数据库 rpm -e my ...
- vue-cli 使用sass(scss)
安装依赖: npm install sass-loader node-sass vue-style-loader --save-dev