Html5在Firefox中拖放鼠标位置 [英] Html5 Drag and Drop Mouse Position in Firefox

问题描述

我有一个使用拖放的HTML5应用程序。基本上用户可以将图像从抽屉拖动到画布上以创建更大的图像。我想要的元素放在他们被释放的地方。我在除Firefox之外的所有浏览器中都有此功能。

在 drop 事件中，我使用以下命令获取鼠标的坐标，并计算位置的画布中丢弃的图像。

  var top = evt.originalEvent.offsetX; 
 var left = evt.originalEvent.offsetY; 
  

问题是，此属性在FF中不可用。有没有其他的方法来得到这个？没有它，我看不到如何在FF中拖动和移动元素。

注意：我没有使用canvas元素。我正在将图像放在div上。不确定是否重要。

解决方案

在firefox中尝试这个。

  var X = event.layerX  -  $（event.target）.position（）。left; 
 var Y = event.layerY  -  $（event.target）.position（）。 
  

I have an HTML5 application which utilizes drag and drop. Essentially the user can drag an image from a "drawer" onto a canvas to create a larger image. I want the elements to drop in the place where they were release. I have this working in all browsers except Firefox.

On the drop event, I am using the following to get the coordinates of the mouse, and calculate the position of the dropped image within the canvas.

var top = evt.originalEvent.offsetX;
var left = evt.originalEvent.offsetY;

The issue is, this property is not available in FF. Is there any other way to get this? Without it, I can't see how to possible drag and move elements within FF.

Note: I am not using the canvas element. I am dropping images to a div. Not sure if that matters.

解决方案

Try this in firefox..

var X = event.layerX - $(event.target).position().left;
var Y = event.layerY - $(event.target).position().top;

这篇关于Html5在Firefox中拖放鼠标位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！