<p>首先先看效果图：类似淘宝的移动悬停菜单。这里有个注意点就是点击菜单之外的地方需要收起菜单，如果页面有标签连接的话就会进行跳转，所以此时要做的就是当悬停菜单出来的时候必须要定义一个层宽高是100%来填充满整个屏幕，来阻碍a标签点击的跳转。而且在移动端的点击时间不能用click这样的话会有冒泡延迟，正确的比较好的解决方案就是用touchstart与touchend之间的时间戳小于大约200ms，再次执行点击的方法。这样可以阻碍冒泡。具体看下一下的脚本：//全局变量，触摸开始位置varstartY=0;//scrollstart事件functionscrollstartFunc(evt){try{vary=Number(evt.pageY);//页面触点Y坐标startY=y;//记录触点初始位置}catch(e){alert('touchStartFunc：'+e.message);}}functionscrollmoveFunc(evt){try{}catch(e){alert('touchMoveFunc：'+e.message);}}functionscrollendFunc(evt){try{vary=Number(evt.pageY);//页面触点Y坐标if(y-startY<0){//向上滑动$("#headerId").addClass("header-fix").removeClass("none");if($(document).scrollTop()==0){$("#headerId").removeClass("none").removeClass("header-fix");}}elseif(y-startY>0){//向下滑动$("#headerId").addClass("none").removeClass("header-fix");}}catch(e){alert('touchEndFunc：'+e.message);}}//触及列表按钮-弹出或关闭首页等列表详细functiontouchRgtHeadFunc(evt){try{if($("#ly_shade").hasClass("none")){$("#rgtHeadId").addClass("right-head-bg");$("#headNavList").removeClass("none");$("#ly_shade").removeClass("none");}else{$("#rgtHeadId").removeClass("right-head-bg");$("#headNavList").addClass("none");$("#ly_shade").addClass("none");}}catch(e){alert('touchRgtHeadFunc：'+e.message);}}//触及背景-关闭首页等列表详细functiontouchBgShadeFunc(evt){try{if(!$("#ly_shade").hasClass("none")){setTimeout(function(){$("#rgtHeadId").removeClass("right-head-bg");$("#headNavList").addClass("none");$("#ly_shade").addClass("none");},220)}}catch(e){alert('touchBgShadeFunc：'+e.message);}}//初始加载functionmyinit(){//绑定上下滑动事件$("#screeBgId").bind('touchstart',function(){scrollstartFunc(event);});$("#screeBgId").bind('touchend',function(){scrollendFunc(event);});//$("#screeBgId").bind('touchmove',function(){scrollmoveFunc(event);});//触及列表按钮-弹出或关闭首页等列表详细$("#rgtHeadId").bind('touchstart',function(){touchRgtHeadFunc(event);});//触及背景-关闭首页等列表详细$("#ly_shade").bind('touchstart',function(){touchBgShadeFunc(event);});}window.onl劳务派遣系统软件d=myinit;本文由免费劳务派遣系统软件系统起航劳务派遣系统原创，转载请注明出处</p>
