Обнаружить изменение направления на событии hammer.js

Я перетаскиваю элемент, используя hammer.js, и я ищу способ отличить, каким образом происходит ярость.Обнаружить изменение направления на событии hammer.js

В общем, я использую

evt.gesture.deltaX>0 //right 
evt.gesture.deltaX<0 //left

deltaX но имеет в виду сопротивление запуска, поэтому, когда я меняю путь во время волочения, я не знаю.

какой-либо способ немедленно изменить направление?

источник

2014-02-20 Bruse

интересно ли помог ответ ... –

вы можете использовать

evt.gesture.direction

возможных значения влево/вправо/вверх/вниз проверить демо здесь: http://eightmedia.github.io/hammer.js/examples/events.html

источник

2014-02-20 11:03:23 Tamura

направление имеют те же проблемы, это шоу прямо даже я начал тащить влево. любая другая идея? – Bruse

Вы используете сенсорное событие? если так, то мы не можем знать направление. только после события перетаскивания мы можем знать направление. Может быть, лучше послушать только драфт и драматург. var hammertime = Hammer (элемент) .on ("dragleft dragright", function (event) { alert ('hello!'); }); – Tamura

ОК. хорошая идея :) – Bruse

Вы можете определить правильное направление во время перетаскивания пропускания центра значения последнего событие, и текущее событие к методу Hammer.utils.getDirection() полезности, как показано ниже:

var el = document.getElementById('sandbox'); 
 
var output = document.getElementById('output'); 
 
var lastCenter; 
 

 
function onDrag(ev){ 
 
    var center = ev.gesture.center; 
 
    if (lastCenter) 
 
     /* use the built in direction determination of hammer 
 
     but use the last position instead of the starting position */ 
 
     output.innerHTML = Hammer.utils.getDirection(lastCenter, center); 
 
    lastCenter = center; 
 
} 
 

 
function onRelease(){ 
 
    lastCenter = null; 
 
} 
 

 
var hammertime = Hammer(el); 
 
hammertime.on("drag", onDrag); 
 
hammertime.on("release", onRelease);

#sandbox 
 
{ 
 
    width: 100%; 
 
    height: 150px; 
 
    line-height:150px; 
 
    text-align:center; 
 
    color:#fff; 
 
    background-color: #29A3CC; 
 
}

<script src="//cdnjs.cloudflare.com/ajax/libs/hammer.js/1.1.3/hammer.min.js"></script> 
 
<div id="sandbox">Drag the mouse here</div> 
 
<div id="output"></div>

_{Примечание: это не работает с последними версиями 2.х}

источник

2014-03-11 05:29:32

Обнаружить изменение направления на событии hammer.js

ответ

Смежные вопросы