是否可以在拖动时更改光标图标，使用 HTML5 原生拖放

Posted 2023-03-04

【中文标题】是否可以在拖动时更改光标图标，使用 HTML5 原生拖放

【英文标题】：Is it possible to change cursor icon while dragging, with HTML5 native drag and drop

【发布时间】：2018-12-25 06:54:55

【问题描述】：

我正在使用本机 html5 拖放，我正在尝试在拖动时更改光标图标。

我在拖动时注意到只有两种类型的图标。 首先是当您将项目移动到可放置区域（底部带有小矩形的默认光标）以及不在该区域（禁止图标）上时

是否可以更改光标图标？例如，当我在可放置区域上方时，我想要手形光标。我还阅读了有关 DataTransfer.dropEffect 和 DataTransfer.effectAllowed 的信息，但这些都没有解决我的问题。

这也不是 CSS 问题，因为我尝试过

* cursor: crosshair!important

没有任何效果，光标没有变化。

【参考方案1】：

我认为您不能将光标更改为 grabbing cursor 之类的东西，而是仅限于 predefined dropEffects，例如复制、移动和链接。

【参考方案2】：

试试这个

:global 
body.dragging,
body.dragging * 
    cursor: url('./assets/cursors/grabbing.cur'), move !important;

【讨论】：

不，看起来不是 css 问题。它不是与 :global

一起工作的事件