拖动的最佳方式是什么?Drop with js,就像谷歌地图中的地图一样

What is the best way to Drag & Drop with js like the map in Google maps?

本文关键字:地图 谷歌地图 一样 是什么 方式 最佳 Drop 拖动 js with      更新时间:2023-09-26

我正在寻找一种简单而强大的方法来拖动&像在Google Maps中放置地图一样的内容。

我已经设法了,但我不确定这是否是最好的方法。我捕获了鼠标(和触摸)事件,如鼠标向上,鼠标向下和鼠标移动,并每次改变每个div元素的x和y位置(位置:绝对)。它可以工作,但在大多数大屏幕的浏览器中,它不是很流畅。

那么有没有一种更高效的方法呢?

第二个问题:当我拖动内容并且鼠标离开浏览器窗口时,它停止拖动。有办法防止这种情况发生吗?

提前感谢!

您的基本方法是正确的:您需要使用鼠标*事件处理程序来获得您想要的功能。关于如何提高性能,我有两个想法:

  • 使用浏览器特定的事件。IE(可能还有其他)除了标准的鼠标事件外,还有一些自己的鼠标事件;使用这些可能会提高你的ie性能(但我不确定,所以你必须实验)

  • 委托事件。如果您有50个元素要附加事件处理程序,那么它将消耗大量内存并影响性能。您可以做的是将这些事件处理程序附加到一个共同的父元素(例如。您的"画布"DIV),然后使用传递给处理程序的事件详细信息来确定实际触发事件的元素。如果你想了解更多这方面的信息,基本原理被称为事件冒泡。

这些只是一些想法(我能做的最好的没有更多的细节);

看看这个库。
http://openlayers.org/。
可以显示一些数据层。