首页 > 移动平台 > 详细

手机端touchstart,touchmove,touchend事件,优化用户划入某个可以点击LI的效果

时间:2016-03-23 11:21:09      阅读:260      评论:0      收藏:0      [点我收藏+]

在我们滑动手机的时候,如果LI或者DIV标签可以点击,那么在移动端给用户一个效果

/*id为添加效果LI上的UL的ID,或者是当前DIV的ID*/
function doTouchPublic(id){
    setTimeout(function(){
        var obj=document.getElementById(id);
            touchPublic.tagUltagDiv(obj);
    },300);    
};
var touchPublic={
    tagUltagDiv:function(obj){
        var objAll;
               /*如果对象为UL,那么给LI添加事件,否则给DIV当前对象添加事件*/
        if(obj.tagName=="UL"){
            objAll=obj.childNodes;
        }else{
            objAll=obj;
        }
        touchPublic.touchMoveEndIf(objAll);
    },
    /*li做委托事件,on为JQ中委托事件*/
    touchMoveEndIf:function(obj){
            
            $(obj).on(‘touchstart‘,function(){
                touchPublic.touchObjstart(this,"objRowOver");
            })
            /*触摸滑动,e.preventDefault();是为了让end触发*/
            $(obj).on(‘touchmove‘,function(){
                touchPublic.touchObjend(this,"objRowOver");
            });
            /*触摸离开*/
            $(obj).on(‘touchend‘,function(){
                touchPublic.touchObjend(this,"objRowOver");
            });
        
    },
    touchObjstart:function(that,color){
        $(that).addClass(color);
    },
    touchObjend:function(that,color){
        if($(that).attr(‘class‘)==color){
            $(that).removeClass(color);
        }
    }
}

 

手机端touchstart,touchmove,touchend事件,优化用户划入某个可以点击LI的效果

原文:http://www.cnblogs.com/binmengxue/p/5310268.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!