Draggable блокирует сенсорное событие
Я пытаюсь использовать перетаскивание для перемещения div вперед и назад. Эта часть работает нормально, пока у div нет прокручиваемого содержимого. Это не проблема на рабочем столе из-за полосы прокрутки, но проблема возникает на сенсорных устройствах. Поскольку событие касания конфликтует с событием перетаскивания, я не могу прокрутить содержимое. Я попытался создать условие, чтобы определить, было ли сопротивление более горизонтальным, чем вертикальным.
Я надеялся предотвратить перетаскивание во время вертикального взаимодействия с сенсорным экраном, но метод перетаскивания пользовательского интерфейса по-прежнему запускает и переопределяет сенсорное событие. Я использую плагин touch-punch, чтобы перетаскивать работу на сенсорных устройствах, поэтому, возможно, что-то там усложнило ситуацию. Было бы замечательно, если бы я мог предотвратить запуск метода перетаскивания пользовательского интерфейса до тех пор, пока не будет выполнено условие горизонтального перетаскивания. Я думаю, что это устранит помехи.
// note the condition inside the drag function
start: function(e){
// get starting point of the drag
startDragX = e.pageX;
startDragY = e.pageY;
},
drag: function(e, ui){
// prevent drag until user has moved 30px horizontally
if (Math.abs(e.pageX - startDragX) < 30){
ui.position.left = 0;
} else {
if (ui.position.left < 0) {
// left drag
ui.position.left = ui.position.left + 30;
} else {
// right drag
ui.position.left = ui.position.left - 30;
}
}
}
Вот скрипка для демонстрации проблемы (тест на сенсорном устройстве):http://jsfiddle.net/jTMxS/2/