中文字幕免费精品_亚洲视频自拍_亚洲综合国产激情另类一区_色综合咪咪久久

Zepto插件:手機網站封裝好的touch事件js
來源:易賢網 閱讀:6264 次 日期:2015-03-18 11:43:26
溫馨提示:易賢網小編為您整理了“Zepto插件:手機網站封裝好的touch事件js”,方便廣大網友查閱!

最近公司開發手機網站,本人主要負責前端這塊的工作,考慮到jquery腳本庫體質大的問題,選擇用Zepto腳本框架,對于手機網站,滑動屏幕事件是頻繁用到的,所以經過一小段時間的研究,本人做了一個基于Zepto.js的插件,主要是對手機網站 上劃,下滑,左劃,右滑事件的封裝。具體代碼如下:

(function($) {

$.fn.touchwipe = function(settings) {

var config = {

min_move_x: 50,

min_move_y: 20,

wipeLeft: function() { },

wipeRight: function() { },

wipeUp: function() { },

wipeDown: function() { },

preventDefaultEvents: false

};

if (settings) $.extend(config, settings);

this.each(function() {

var startX;

var startY;

var isMoving = false;

var directionLocked = null;

function cancelTouch() {

this.removeEventListener('touchmove', onTouchMove);

startX = null;

isMoving = false;

directionLocked = false;

}

function onTouchMove(e) {

if(config.preventDefaultEvents) {

e.preventDefault();

}

if(isMoving) {

var x = e.changedTouches ? e.changedTouches[0].clientX: e.clientX;

var y = e.changedTouches ? e.changedTouches[0].clientY: e.clientY;

var dx = startX - x;

var dy = startY - y;

var absDistX = Math.abs(dx);

var absDistY = Math.abs(dy);

if (directionLocked === "y") {

return

} else {

if (directionLocked === "x") {

e.preventDefault()

} else {

absDistX = Math.abs(dx);

absDistY = Math.abs(dy);

if (absDistX < 4) {

return

}

if (absDistY > absDistX ) {

dx = 0;

directionLocked = "y";

return

} else {

e.preventDefault();

directionLocked = "x"

}

}

}

if(absDistX >= config.min_move_x) {

cancelTouch();

if(dx > 0) {

config.wipeLeft();

}

else {

config.wipeRight();

}

}

}

}

function onTouchStart(e)

{

if (e.touches.length == 1) {

startX = e.changedTouches ? e.changedTouches[0].clientX: e.clientX;

startY = e.changedTouches ? e.changedTouches[0].clientY: e.clientY;

isMoving = true;

directionLocked = false;

this.addEventListener('touchmove', onTouchMove, false);

}

}

if ('ontouchstart' in document.documentElement) {

this.addEventListener('touchstart', onTouchStart, false);

}

});

return this;

};

})(Zepto);

更多信息請查看IT技術專欄

更多信息請查看腳本欄目
由于各方面情況的不斷調整與變化,易賢網提供的所有考試信息和咨詢回復僅供參考,敬請考生以權威部門公布的正式信息和咨詢為準!

2026國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯系我們 | 人才招聘 | 網站聲明 | 網站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
云南網警備案專用圖標
聯系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網
云南網警報警專用圖標
主站蜘蛛池模板: 邯郸市| 棋牌| 遂川县| 深泽县| 富宁县| 泊头市| 林周县| 怀来县| 武平县| 崇文区| 黔江区| 乌兰浩特市| 广河县| 仙桃市| 桃江县| 当阳市| 西畴县| 邢台县| 黄陵县| 大埔区| 宜阳县| 桃园市| 秦皇岛市| 盐亭县| 长沙市| 灵川县| 抚州市| 白玉县| 南木林县| 蛟河市| 壤塘县| 旬邑县| 紫金县| 上思县| 东港市| 新干县| 长阳| 万安县| 梁平县| 错那县| 会同县|