Podoba mi się twoje rozwiązanie i zaimplementowałem je na mojej stronie - jednak z niewielkimi ulepszeniami.Po prostu chciałem podzielić się moją kod:
function detectSwipe(id, f) {
var detect = {
startX: 0,
startY: 0,
endX: 0,
endY: 0,
minX: 30, // min X swipe for horizontal swipe
maxX: 30, // max X difference for vertical swipe
minY: 50, // min Y swipe for vertial swipe
maxY: 60 // max Y difference for horizontal swipe
},
direction = null,
element = document.getElementById(id);
element.addEventListener('touchstart', function (event) {
var touch = event.touches[0];
detect.startX = touch.screenX;
detect.startY = touch.screenY;
});
element.addEventListener('touchmove', function (event) {
event.preventDefault();
var touch = event.touches[0];
detect.endX = touch.screenX;
detect.endY = touch.screenY;
});
element.addEventListener('touchend', function (event) {
if (
// Horizontal move.
(Math.abs(detect.endX - detect.startX) > detect.minX)
&& (Math.abs(detect.endY - detect.startY) < detect.maxY)
) {
direction = (detect.endX > detect.startX) ? 'right' : 'left';
} else if (
// Vertical move.
(Math.abs(detect.endY - detect.startY) > detect.minY)
&& (Math.abs(detect.endX - detect.startX) < detect.maxX)
) {
direction = (detect.endY > detect.startY) ? 'down' : 'up';
}
if ((direction !== '') && (typeof f === 'function')) {
f(element, direction);
}
});
}
używać go jak:
detectSwipe('an_element_id', myfunction);
Albo
detectSwipe('another_element_id', my_other_function);
Jeśli machnięcia wykryciu funkcję myfunction
jest wywoływana z parametrem element id i 'left'
, 'right'
, 'up'
lub oder 'down'
.
Możesz zajrzeć do problemów, które pojawiły się w jGestures. Sam tego nie użyłem, ale wygląda na to, że napisałem świetną wersję niestandardowego kodu, który napisałem dla prostej obsługi gestów (i gdzie indziej). –
Dodano je do edycji. – fotuzlab
"Polecono mi NIE używać jquery mobile." czemu? – givanse