移動端觸屏滑動的效果其實就是輪播，在pc的頁面上很好實現，繫結click和mouseover等事件來完成。但是在移動裝置上，要實現這種輪播的效果，就需要用到核心的touch事件。處理touch事件能跟蹤到螢幕滑動的每根手指。
以下是四種touch事件
touchstart: //手指放到螢幕上時觸發
touchmove: //手指在螢幕上滑動式觸發
touchend: //手指離開螢幕時觸發
touchcancel: //系統取消touch事件的時候觸發，這個好像比較少用
每個觸控事件被觸發後，會生成乙個event物件，event物件裡額外包括以下三個觸控列表
touches: //當前螢幕上所有手指的列表
targettouches: //當前dom元素上手指的列表，盡量使用這個代替touches
changedtouches: //涉及當前事件的手指的列表，盡量使用這個代替touches
這些列表裡的每次觸控由touch物件組成，touch物件裡包含著觸控資訊，主要屬性如下：
clientx / clienty: //觸控點相對瀏覽器視窗的位置
pagex / pagey: //觸控點相對於頁面的位置
screenx / screeny: //觸控點相對於螢幕的位置
identifier: //touch物件的id
target: //當前的dom元素
注意：
手指在滑動整個螢幕時，會影響瀏覽器的行為，比如滾動和縮放。所以在呼叫touch事件時，要注意禁止縮放和滾動。
1.禁止縮放
通過meta元標籤來設定。
2.禁止滾動
preventdefault是阻止預設行為，touch事件的預設行為就是滾動。
event.preventdefault();
案例：
下面給出乙個案例，需在移動裝置上才能看出效果。
1.定義touchstart的事件處理函式，並繫結事件：
if(!!self.touch) self.slider.addeventlistener('touchstart',self.events,false);
//定義touchstart的事件處理函式
start:function(event); //取第乙個touch的座標值
isscrolling = 0; //這個引數判斷是垂直滾動還是水平滾動
this.slider.addeventlistener('touchmove',this,false);
this.slider.addeventlistener('touchend',this,false);},
觸發touchstart事件後，會產生乙個event物件，event物件裡包括觸控列表，獲得螢幕上的第乙個touch,並記下其pagex,pagey的座標。定義乙個變數標記滾動的方向。此時繫結touchmove,touchend事件。
2.定義手指在螢幕上移動的事件，定義touchmove函式。
//移動
move:function(event);
isscrolling = math.abs(endpos.x) < math.abs(endpos.y) ? 1:0; //isscrolling為1時，表示縱向滑動，0為橫向滑動
if(isscrolling === 0)},
同樣首先阻止頁面的滾屏行為，touchmove觸發後，會生成乙個event物件，在event物件中獲取touches觸屏列表，取得第乙個touch,並記下pagex,pagey的座標，算出差值，得出手指滑動的偏移量，使當前dom元素滑動。
3.定義手指從螢幕上拿起的事件，定義touchend函式。
//滑動釋放
end:function(event)else if(endpos.x < -10)
}this.icon[this.index].classname = 'curr';
this.slider.classname = 'cnt f-anim';
this.slider.style.left = -this.index*600 + 'px';
}//解綁事件
this.slider.removeeventlistener('touchmove',this,false);
this.slider.removeeventlistener('touchend',this,false);},
手指離開螢幕後，所執行的函式。這裡先判斷手指停留螢幕上的時間，如果時間太短，則不執行該函式。再判斷手指是左滑動還是右滑動，分別執行不同的操作。最後很重要的一點是移除touchmove,touchend繫結事件。
源**：
12345
JS移動客戶端 觸屏滑動事件
移動端觸屏滑動的效果其實就是輪播，在pc的頁面上很好實現，繫結click和mouseover等事件來完成。但是在移動裝置上，要實現這種輪播的效果，就需要用到核心的touch事件。處理touch事件能跟蹤到螢幕滑動的每根手指。以下是四種touch事件 touchstart 手指放到螢幕上時觸發 tou...
JS移動客戶端 觸屏滑動事件
移動端觸屏滑動的效果其實就是輪播，在pc的頁面上很好實現，繫結click和mouseover等事件來完成。但是在移動裝置上，要實現這種輪播的效果，就需要用到核心的touch事件。處理touch事件能跟蹤到螢幕滑動的每根手指。以下是四種touch事件 touchstart 手指放到螢幕上時觸發 tou...
JS移動客戶端 觸屏滑動事件
移動端觸屏滑動的效果其實就是輪播，在pc的頁面上很好實現，繫結click和mouseover等事件來完成。但是在移動裝置上，要實現這種輪播的效果，就需要用到核心的touch事件。處理touch事件能跟蹤到螢幕滑動的每根手指。以下是四種touch事件 touchstart 手指放到螢幕上時觸發 tou...