(function(window,document){
    var Slide = function(box,judge,fun){
        if (!(this instanceof Slide)) return new Slide(box,judge,fun);
        var startx,starty;
        box.addEventListener("touchstart", function(e) {
            e.preventDefault(); // 阻止瀏覽器預設事件
            startx = parseInt(e.touches[0].pageX);
            starty 
 
= parseInt(e.touches[0].pageY);//獲取滑動開始的X,Y值
        }, false);
        box.addEventListener("touchend", function(e) {
            e.preventDefault(); // 阻止瀏覽器預設事件
            var endx, endy;
            endx = parseInt(e.changedTouches[0].pageX);
            endy = parseInt(e.changedTouches[0].pageY);//獲取滑動結束的X,Y值
 

            var absx =startx-endx; 
            var absy =starty-endy;
            //console.log(absx,absy,absy,3)
            if(judge=="about" || judge=="aboutupdown"){
                //檢測左右滑動
                if(Math.abs( absx)>Math.abs(absy)&&Math.abs(absy)>=3){
                    if
 
(absx>0){
                        fun.leftslide();
                    }else {
                        fun.rightslide();
                    }
                }
            }
            if(judge=="updown" || judge=="aboutupdown"){
                //檢測上下滑動
                if(Math.abs( absy)>Math.abs(absx)&&Math.abs(absx)>=3){
                    if(absy>0){
                        fun.topslide()
                    }else {
                        fun.bottomslide()
                    }
                }
            }
        })
    }
    window.Slide = Slide;
})(window,document)

呼叫方法

 //第一個引數為DOM物件
        Slide(box,"about",{//第二個引數有三個值：左右滑動：about，上下滑動：updown，上下左右：aboutupdown
            leftslide:function(){//第三個引數可傳入滑動後的操作方法
                alert("向左滑動了")
            },
            rightslide:function(){
                alert("向右滑動了")
            },
            topslide:function(){
                alert("向上滑動了")
            },
            bottomslide:function(){
                alert("向下滑動了")
            }
        })