자바 스크립트 - 버튼 스 와이프를 감지 하시겠습니까?

Question

저는 버튼이 있습니다. 그 중 하나는 사용자가 (모바일 플랫폼에서) 사용자가 버튼을 누른 상태에서 스 와이프 할 수 있는지 궁금합니다. 함수 호출을 초래하는 것 :

버튼 + (단추가 와이프) == 통화 기능

이 모바일 브라우저 가능할 것이다. 감사?!?

Answer 1

나는 과거에 Hammer.js를 사용하여 성공했습니다. 기본적으로이 작업을 수행 할 수 있지만 전반적으로 Hammer.js를 사용하는 것이 더 쉽다고 생각합니다.

https://hammerjs.github.io/

Answer 2

당신은이 기능을 사용할 수 있습니다

$(window).load(function(){ 
    detectswipe('btnid',myfunc); 
}); 

function detectswipe(el,func) { 
    swipe_det = new Object(); 
    swipe_det.sX = 0; swipe_det.sY = 0; swipe_det.eX = 0; swipe_det.eY = 0; 
var min_x = 100; //min x swipe for horizontal swipe 
var max_x = 100; //max x difference for vertical swipe 
var min_y = 100; //min y swipe for vertical swipe 
var max_y = 100; //max y difference for horizontal swipe 
var direc = ""; 
ele = document.getElementById(el); 
if(ele==null){ 
    return; 
} 
ele.addEventListener('touchstart',function(e){ 
    var t = e.touches[0]; 
    swipe_det.sX = t.screenX; 
    swipe_det.sY = t.screenY; 
},false); 
ele.addEventListener('touchmove',function(e){ 
    var t = e.touches[0]; 
    swipe_det.eX = t.screenX; 
    swipe_det.eY = t.screenY; 
},false); 
ele.addEventListener('touchend',function(e){ 
    if ((((swipe_det.eX - min_x > swipe_det.sX) || (swipe_det.eX + min_x < swipe_det.sX)) && ((swipe_det.eY < swipe_det.sY + max_y) && (swipe_det.sY > swipe_det.eY - max_y) && (swipe_det.eX > 0)))) { 
     if(swipe_det.eX > swipe_det.sX) direc = "right"; 
     else direc = "left"; 
    } 
    else if ((((swipe_det.eY - min_y > swipe_det.sY) || (swipe_det.eY + min_y < swipe_det.sY)) && ((swipe_det.eX < swipe_det.sX + max_x) && (swipe_det.sX > swipe_det.eX - max_x) && (swipe_det.eY > 0)))) { 
     if(swipe_det.eY > swipe_det.sY) direc = "down"; 
     else direc = "up"; 
    } 
    if (direc != "") { 
     if(typeof func == 'function') func(el,direc); 
    } 
    direc = ""; 
    swipe_det.sX = 0; swipe_det.sY = 0; swipe_det.eX = 0; swipe_det.eY = 0; 
},false); 
} 

function myfunc(el,d){ 
if(d=="up"){ 
    console.log("do Some Work!!");//or any function which you want to call on swipe up/down(matter of prespective,change "up" to down if you want the other way). 
} 
} 

그것은 touchevents로 슬쩍 방향을 감지합니다. 내 프로젝트에서이 기능을 사용했지만 모든 터치 장치에서 완벽하게 작동합니다.