设计效果:当手指点击或触摸红框线menuList之外的部分时,弹框menuList消失。
问题:在优化触屏版的时候发现如图问题,当menuList弹出,手指触摸屏幕向下滑动时,menuList弹框不消失,只有手指点击menuList之外的部分才消失。
查看代码发现,源代码只定义了click事件:
$(doc.body).on('click',function(e) {
if...
分类:
其他好文 时间:
2014-08-30 17:48:19
阅读次数:
154
前段时间开发移动web,遇到了一个问题,就是a的点击效果(a:active)在pc端可以正常显示,但是在手机上就不会显示,这个是由于手机浏览器上body有默认的touch效果。解决方法:把下面代码放到页面上面即可。document.addEventListener("touchstart",func...
分类:
移动开发 时间:
2014-08-27 10:37:27
阅读次数:
201
移动端触屏滑动的效果其实就是图片轮播,在PC的页面上很好实现,绑定click和mouseover等事件来完成。但是在移动设备上,要实现这种轮播的效果,就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。以下是四种touch事件touchstart: //手指放到屏幕上时触....
分类:
移动开发 时间:
2014-08-25 14:50:54
阅读次数:
287
移动端触屏滑动的效果其实就是图片轮播,在PC的页面上很好实现,绑定click和mouseover等事件来完成。但是在移动设备上,要实现这种轮播的效果,就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。以下是四种touch事件touchstart: //手指放到屏幕上时.....
分类:
移动开发 时间:
2014-08-14 23:32:36
阅读次数:
319
诸如智能手机和平板电脑一类的移动设备通常会有一个电容式触摸屏(capacitive touch-sensitive screen),以捕捉用户的手指所做的交互。随着移动网络的发展,其能够支持越来越复杂的应用,web开发者需要一种方法来处理这些事件。例如,几乎所 有的快节奏游戏都需要玩家一次按下多个按...
分类:
移动开发 时间:
2014-07-23 20:18:05
阅读次数:
326
$('#webchat_scroller').on('touchstart',function(e) { var touch = e.originalEvent.targetTouches[0]; var y = touch.pageY; }); $('#webchat_scroller')...
分类:
Web程序 时间:
2014-07-23 12:40:06
阅读次数:
225
处理Touch事件能让你跟踪用户的每一根手指的位置。你可以绑定以下四种Touch事件:touchstart: // 手指放到屏幕上的时候触发 touchmove: // 手指在屏幕上移动的时候触发 touchend: // 手指从屏幕上拿起的时候触发 touchcancel: // 系统取消t...
分类:
移动开发 时间:
2014-07-22 22:55:54
阅读次数:
198
touchstart:触摸开始的时候触发touchmove:手指在屏幕上滑动的时候触发touchend:触摸结束的时候触发而每个触摸事件都包括了三个触摸列表,每个列表里包含了对应的一系列触摸点(用来实现多点触控):touches:当前位于屏幕上的所有手指的列表。targetTouches:位于当前D...
分类:
移动开发 时间:
2014-06-24 10:42:56
阅读次数:
218
根据源码所见,移动端为了将将单击事件更加灵敏,所以现在的JQM,ST...框架都将JS单击事件封装成tap,或者touch或者touchstart事件,其实现本质是将click触发多次,以打成移动端触屏灵敏的效果.所以这里如果使用手机浏览器访问你的st,或者jqm项目,就得使用js修改成click事...
分类:
其他好文 时间:
2014-06-15 21:59:07
阅读次数:
933
可封装的js代码if (typeof YwkMobile == "undefined")
var YwkMobile = {};YwkMobile.touchStyle = function(e, t)
{ $(e).bind("touchstart", function() { $(this).....
分类:
其他好文 时间:
2014-06-12 20:33:45
阅读次数:
289