Подтвердить что ты не робот

HTML5 Drag and Drop API для сенсорных экранов

Мне просто интересно, поддерживает ли HTML5 API для Drag and Drop поддержку сенсорных экранов.

Я думал об iPhone, но я знаю, что это еще не поддерживается. Мне было интересно, просто ли это ускользнуло от Apple, чтобы поддерживать перетаскивание HTML5 на мобильном устройстве Safari, но я также думал, что API HTML5 для этого недостаточно мощный, но я очень сомневаюсь в этом.

Как насчет стандартного планшета для ноутбука с сенсорным экраном и т.д., у меня его нет, поэтому я не могу проверить, но я бы предположил, что поддержка включена, поскольку, насколько мне известно, этот интерфейс таблицы просто заменяет мышь поэтому, насколько это касается браузера, конечный пользователь действительно просто использует мышь.

Любые мысли?

4b9b3361

ОТВЕТЫ

Ответ 1

Есть некоторые родные события HTML5, которые работают в версиях WebKit (Chrome и Safari)... только для мобильных устройств. Название этих событий - сенсорный, touchmove, touchhend, touchcancel

Примером перемещения элемента является:

$(document).bind("touchstart", function(e) {
e.preventDefault();
var orig = e.originalEvent;
var x = orig.changedTouches[0].pageX;
var y = orig.changedTouches[0].pageY;

$("#element").css({top: y, left: x});
});

Дополнительная информация: http://developer.apple.com/safari/library/documentation/UserExperience/Reference/TouchEventClassReference/TouchEvent/TouchEvent.html#//apple_ref/javascript/cl/TouchEvent

BTW Я предпочитаю работать с webkit-transform (свойства CSS), потому что он имеет лучшую производительность.

Удачи.

Ответ 2

Старый поток, но поскольку у меня есть некоторый опыт, и это все еще проблема, я дам ему выстрел...

Прикосновение и перетаскивание не очень хорошо сочетаются друг с другом. Учтите, что для перетаскивания вы имеете подразумеваемую последовательность событий mouse-down = > mouse-move = > mouse-up. В сенсорной среде у вас есть не только стандартные события touchstart, touchmove и touchhend, но также есть реальные жесты, которые имеют определенные значения на разных платформах. Эти жесты - это комбинации сенсорных событий, их порядок и время.

Итак, как бы вы перетащили элемент с помощью касания? Захватив сенсорный старт и touchmove? Нет. Из-за проблемы с жирным пальцем почти каждое событие касания имеет как сенсорный старт, так и touchmove. Вы также можете иметь два touchstarts с одним касанием иногда с грязным экраном.

Как насчет захвата touchstart, а затем ожидания, чтобы узнать, переместился ли пользователь на определенное расстояние? Нет, проблема заключается в том, что пользователь увидит "сбой", когда он переместит палец на 15 пикселей (или на какое-либо расстояние), и ничего не произойдет, а затем элемент сглазает его положение пальца. Нормальная реакция заключается в том, чтобы поднять палец, который в этом случае инициирует падение, неправильный ответ.

В конце концов, пытаясь разработать интерфейс, в котором некоторые элементы неподвижны, а другие могут, но не обязательно, draggable пытается подогнать среду рабочего стола в сенсорное устройство. Парадигмы не подходят.

Лучше смотреть на различные сенсорные рамки и использовать встроенные жесты.