2

我正在使用 GWT 2.4 Drag and Drop API 来拖动元素以在小部件之间传输数据。实现拖放行为很简单，但是在拖动元素时更改光标时遇到问题。我做了一些研究，发现了一些关于如何实现这一目标的文章。

这篇文章http://blog.vjeux.com/2012/css/css-cross-browser-drag-cursor.html建议可以通过将光标属性设置为我们想要的任何可接受的值来完成。我已经尝试过（cursor: -webkit-drag; 或 cursor: move;）在要拖动的元素或可以删除​​元素的元素上，但只在光标图标的右下角添加了一个小图像。

看看这个http://www.html5rocks.com/en/tutorials/dnd/basics/，据说可以通过从dataTransfer对象设置effectAllowed和dropEffect来改变拖放时的光标（效果）。尽管 GWT 拖放 API 没有公开这些属性，但我可以通过JSNI设置它们，但效果与以前相同（使用 CSS）。

我发现这些问题HTML5 Drag & Drop Change icon/cursor while dragging and changed Mouse Cursor for HTML5 Drag Drop Files (GMail Drag Drop)在同一主题上，但似乎没有一个有助于在拖动时实际更改/替换图标。

任何帮助表示赞赏。

测试环境：

Ubuntu 12.04.1 铬 22

干杯，

4

1 回答 1

0

我想最简单的方法是使用：

RootPanel.getBodyElement().getStyle().setCursor(Cursor.MOVE);

每当您开始移动并且：

RootPanel.getBodyElement().getStyle().setCursor(Cursor.DEFAULT);

每当你完成。

您还可以设置 CSS 属性：

cursor: whatever;

在你想要的任何元素上。你通常会这样使用它：

div.over-this-div-the-cursor-becomes-different:hover {
    cursor: move;
}

见：http ://www.w3schools.com/cssref/pr_class_cursor.asp

于 2012-10-11T15:54:44.720 回答