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/

Ответы на вопрос(2)

Ваш ответ на вопрос