Как заставить clientX и clientY работать внутри моего обработчика событий "перетаскивания" в Firefox?

Mozilla firefox 3.x, похоже, имеет ошибку при прослушивании события "ondrag". Объект события не сообщает о положении перетаскиваемого объекта, clientX, clientY и другие смещения экрана устанавливаются на ноль. Это довольно проблематично, так как я хотел создать прокси-элемент на основе перетаскиваемого элемента и, конечно, с помощью clientX и clientY, чтобы отрегулировать его положение.

Я знаю, что в HTML5 есть такие интересные вещи, как setDragImage, но я хочу предоставить общую абстракцию для нативного DD между браузерами.

Неисправный код:

document.addEventListener('drag', function(e) {
    console.log(e.clientX); // always Zero
}, false);

Примечание. Эта проблема не возникает в других событиях (dragstart, dragover), и события перемещения мыши не могут быть записаны при перетаскивании чего-либо.

Пожалуйста помоги!

Источник

3 ответа

Решение

Я нашел решение, я поместил слушателя на событие "dragover" на уровне документа, теперь я получаю правильные свойства X и Y, которые я могу предоставить через глобально общий объект.

Источник

Событие перетаскивания в HTML 5 не полностью функционально в современных браузерах. Для имитации ситуации перетаскивания вы должны использовать:

  1. Добавьте событие onmousedown, установив var true.
  2. Добавьте событие onmouseup, установив, что var false.
  3. Добавьте событие onmousemove, проверив, истинно ли это var, и, если это так, переместите ваш div в соответствии с координатами.

Это всегда работало для меня. Если у вас возникнут какие-либо проблемы, свяжитесь снова, я могу привести несколько примеров.

удачи!

Источник

Я знаю, что в HTML5 есть такие интересные вещи, как setDragImage, но я хочу предоставить общую абстракцию для нативного DD между браузерами.

Но зачем делать что-то подобное, нет ли таких библиотек, как JQuery & Prototype, доступных для кросс-браузерного перетаскивания?

Или же, если вы хотите реализовать собственную библиотеку DD, вы можете воспользоваться их методами или расширить их, поскольку обе библиотеки следуют объектно-ориентированной парадигме.

Это сэкономит много времени.

Источник
Другие вопросы по тегам