码迷,mamicode.com
首页 > 其他好文 > 详细

触屏touchstart 与 click

时间:2014-08-30 17:48:19      阅读:154      评论:0      收藏:0      [点我收藏+]

标签:js   touchstart   触摸屏   


bubuko.com,布布扣

设计效果:当手指点击或触摸红框线menuList之外的部分时,弹框menuList消失。

问题:在优化触屏版的时候发现如图问题,当menuList弹出,手指触摸屏幕向下滑动时,menuList弹框不消失,只有手指点击menuList之外的部分才消失。


查看代码发现,源代码只定义了click事件:

$(doc.body).on('click',function(e) {
					if (e.target.id != 'menu') headerMenu.hide();
				});

说明触屏版对click和touch解析是不同的事件。

于是查了下touch的用法,发现是有touchstart,touchmove,touchend事件的,并且可以像click样直接使用。

于是更改代码:

$(doc.body).on('click touchmove',function(e) {
					if (e.target.id != 'menu') headerMenu.hide();
				});

OK,可以

更多demo和解析:http://www.aliued.cn/2013/04/27/%E7%A7%BB%E5%8A%A8%E5%BC%80%E5%8F%91%E4%B9%8Btouch-event%E7%AF%87.html


触屏touchstart 与 click

标签:js   touchstart   触摸屏   

原文地址:http://blog.csdn.net/smy_yu/article/details/38945637

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!