原生封裝的 tap 和 swipe 事件

2021-08-21 06:15:36 字數 1909 閱讀 1492

function

itcast(

dom)

// 2 記錄按下的時間 返回的是1970 1 1 到現在的時間戳 毫秒

starttime

=date

. now();

// console.log(starttime);

// 3 記錄開始的座標

startx=e.

touches[

0].clientx;

starty=e.

touches[

0].clienty; })

// touchend 離開

dom.

addeventlistener(

"touchend",

function

( e)

// 2 計算結束的時間

varendtime

=date

. now();

if (

endtime

-starttime

>

200)

// 3 計算距離

varendx=e.

changedtouches[

0].clientx;

varendy=e.

changedtouches[

0].clienty;

if (

math.

abs(

endx

-startx)

>5||

math.

abs(

endy

-starty)

>

5)

// 執行自己的tap的邏輯

callback

&&callback(); })

},swipe:

function

( callback)

// 2 記錄按下的時間

starttime

=date

. now();

// 3 記錄按下的座標

startx=e.

touches[

0].clientx;

starty=e.

touches[

0].clienty; })

// 離開

dom.

addeventlistener(

"touchend",

function

( e)

// 2 計算時間

varendtime

=date

. now();

if (

endtime

-starttime

>

800)

// 3 計算距離和方向

// 3.1 先判斷水平方向上的

vardirection;

varendx=e.

changedtouches[

0].clientx;

varendy=e.

changedtouches[

0].clienty;

if (

math.

abs(

endx

-startx)

>

5)

else

if (

math.

abs(

endy

-starty)

>

5)

else

// 觸發自己的邏輯

// console.log(direction);

callback

&&callback(

direction); })

} };

return

obj; }

ajax和jsonp的原生封裝

最近在學ajax和跨域,於是就自己封裝了乙個,雖然有點粗糙但還是可以用的。其實jsonp的本質就是 動態建立script標籤,然後通過src屬性傳送跨域請求,然後伺服器端響應的資料格式為 函式呼叫 foo 實參 所以在傳送請求之前必須先宣告乙個函式,並且函式的名字與引數中傳遞的名字要一致。這裡宣告的...

swipe和swiper的區別

swipe.js 移動web頁面內容觸控滑動類庫 參考1 swipe只提供簡單輪播切換,底部的圓點顏色切換需要重新寫html,自定義方便。2 當你用點選或者手勢控制了之後,輪播圖就不會自動滾動了,需要將swipe.js外掛程式源 進行修改 function stop 3 適合簡單的輪播需求,體積小,...

mui和zepto的tap事件

zepto.js和mui一起使用的時候,tap事件會發生兩次,這時只要不引用zepto.js的touch.js就可以了,只用mui的tap事件 b5教程網 1.zepto.js和mui一起使用的時候,tap事件會發生兩次,這時只要不引用zepto.js的touch.js就可以了,只用mui的tap事...