javascript - 在开始拖动和拖动中更改光标
问题描述
如何在 HTML5 的不同拖放(startDrag 和 dragOver)事件中更改光标样式?
我做了一些测试,但我做不到。有人可以帮忙吗,谢谢。
const elementDiv1 = document.getElementById('div1');
const elementDrag1 = document.getElementById('drag1')
elementDiv1.addEventListener("drop", drop);
elementDiv1.addEventListener("dragover", allowDrop);
elementDrag1.addEventListener("dragstart", drag);
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
ev.dataTransfer.setData("text", ev.target.id);
}
function drop(ev) {
ev.preventDefault();
var data = ev.dataTransfer.getData("text");
ev.target.appendChild(document.getElementById(data));
}
#div1 {
width: 350px;
height: 70px;
padding: 10px;
border: 1px solid #aaaaaa;
}
#drag1 {
cursor: url(https://i.imgur.com/2Lc66bn.png), auto;
}
<div id="div1"></div>
<img id="drag1" src="https://i.imgur.com/2Lc66bn.png" draggable="true" >
解决方案
推荐阅读
- liquid - 一个简单的 Liquid CamelCase 不起作用
- visio - 其他页面上的对象不断移动
- regex - 如何在 Nim 中获取正则表达式的一部分
- sql - rown_number() 在 Access 中过分区,用两行数据进行 Pivot 获取
- flutter - 如何在flutter pubspec中自动将所有依赖项的版本信息更新为最新版本
- javascript - 模态、弹出框和离子选择未显示
- c - 在全局范围内使用 calloc 声明 ptr 时出错
- amazon-web-services - AWS Sagemaker 无法部署 SKLearn 模型:调用 CreateBucket 操作时拒绝访问
- java - 如何查找文件夹中每个单词的位置?
- php - 变换多维数组结构