封裝的乙個手機端全屏滑動方法

2022-02-19 18:19:06 字數 2083 閱讀 3777

下面是具體的**:

1 ;(function

(root)

1213 touch.prototype.init=function

()26

else31}

3233

};34

35 touch.prototype.bindevent=function

()47

48function

move(e)

59 }else64}

65e.preventdefault();

66e.stoppropagation();

6768}69

70function

end()else

if(value < -_this.boundary)else

84 }else

else

if(value <-50)else

94 _this.offsetx = 0;

95 _this.offsety = 0;96}

97}9899 (_this.direc != 'horiz')?handle(_this.offsety):handle(_this.offsetx);

100101

102}

103104

this.canvas.addeventlistener('touchstart',start,false

);105

this.canvas.addeventlistener('touchmove',move,false

);106

this.canvas.addeventlistener('touchend',end,false

);107

};108

109110 touch.prototype.go=function

(n)else

if(index <=0)

121122

function

callback()

126127

this.section[index].style.webkittransition = '-webkit-transform .4s ease-out';

128this.section[index-1] && (this.section[index-1].style.webkittransition = '-webkit-transform .4s ease-out');

129this.section[index+1] && (this.section[index+1].style.webkittransition = '-webkit-transform .4s ease-out');

130this.section[index].style.webkittransform = 'translate3d(0,0,0)';

131132

if(this.direc != 'horiz')else

139140

this.index =index;

141this.section[index].addeventlistener('webkittransitionend',callback,false

);142

};143

144 root.touch = function

(p);

147148 })(window);

呼叫方法:

1

touch(

6});7/*

{} 乙個物件,用於提供設定的引數。

8|— dom : 所有分屏的外層包裹盒子。

9|— section : 所有分屏。

10|— direc : 滑屏的方向:horiz(水平滑動,最大寬度為640)、vertical(垂直滑動)。預設值為vertical。

11|- fn : 滑動後的**函式,i(索引)、t(當前分屏)、s(所有的分屏)、box(分屏的外層包裹盒子)

12*/

封裝的乙個手機端全屏滑動方法

下面是具體的 1 function root 12 13 touch.prototype.init function else if value this.boundary else 84 elseelse if value 94 this.offsetx 0 95 this.offsety 0 9...

封裝乙個移動端的滑動事件

if window.swipe swipe.iscroll function args swipe.iscroll.prototype 如果不存在父容器就停止初始化 if that.parentdom return false 找到子容器 that.childdom that.parentdom.c...

uni app 專案封裝乙個滑動元件

記錄使用者按下螢幕的時間 date.now 注意 返回的時時間戳,1970 1 1 到現在的毫秒數 記錄使用者按下螢幕的座標 x 和 y 記錄使用者離開螢幕的時間 date.now 記錄使用者離開螢幕的座標 x 和 y 根據兩個時間 運算 判斷 使用者按下螢幕時長是否合法 根據兩對座標 判斷距離是否...