gpt4 book ai didi

html - 控制HTML5拖放效果的外观

转载 作者:技术小花猫 更新时间:2023-10-29 12:01:07 25 4
gpt4 key购买 nike

有没有一种方法可以使用 HTML5 拖放 API 来控制“您正在拖动的内容”的外观?

通常,任何可拖动的 HTML 元素都会变为半透明并跟随您的光标,直到您停止/放下。我想对其进行控制,以便我可以从元素内的任何位置开始拖动,但当您真正开始拖动时,我只能让一个小图像跟随光标,正好是光标所在的位置。

实际的例子是:要拖动的东西的列表,每个都是一个小图像和一些文本,用于表示要拖到它旁边的东西的名称。我希望能够在图像或文本上方的元素中的任何位置开始拖动,但只有图像跟随您的光标,并直接在光标下方,而不是从您开始拖动它的位置偏移。

我可以想出一些方法来欺骗它(一个隐藏的元素出现在鼠标光标所在的位置,当你开始拖动时,它就是你实际拖动的东西),或者求助于经典的 Javascript 拖放。

谢谢

最佳答案

我认为 .setDragImage(element, x, y); 可能就是您要找的。

function handleDragStart(e) {
var dragIcon = document.createElement('img');
dragIcon.src = 'http://...';
dragIcon.width = 100;
e.dataTransfer.setDragImage(dragIcon, x, y);
}

this.addEventListener('dragstart', handleDragStart, false);

此处示例:jsfiddle.net/cnAHv/

关于html - 控制HTML5拖放效果的外观,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17055044/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com