How do I get clientX and clientY to work inside my “drag” event handler on Firefox?

淺唱寂寞╮ 提交于 2019-11-30 19:14:00

I found a solution, I've placed a listener on the "dragover" event at the document level, now I get the right X and Y properties that I can expose through a globally shared object.

The drag event in HTML 5 is not fully functional in todays browsers. To simulate a drag n drop situation you should use:

  1. Add a onmousedown event, setting a var true.
  2. Add a onmouseup event, setting that var false.
  3. Add a onmousemove event, checking if that var is true, and if it is, move your div according to the coordinates.

This always worked for me. If you face any problems, get in touch again, I can provide some examples.

good luck!

I know that there's cool stuff around such as setDragImage in HTML5 but I want to provide a generic abstraction for native DD between browsers.

But why do something like this, aren't there libraries like JQuery & Prototype available for cross browser drag & drop?

Or else if you want to implement a DD library of your own, you can take help of their methods or extend them, as both the libraries are following object oriented paradigm.

This will save much time.

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!