<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK" />
<title>2.5.5改变拖放图标</title>
</head>
<body>
通过调用DataTransfer对象的setDragImage还可以改变拖放图标。<br>
eg:<br>
<div id="source" draggable="true" style="width:80px;height:60px;
border:1px solid black;">拖动我</div>
<script type="text/javascript">
var source = document.getElementById("source");
var dest = document.getElementById("text");
<!--创建img元素-->
var myIcon = document.createElement("img");
myIcon.src = "images/my.gif";
source.ondragstart = function(evt)
{
var dt = evt.dataTransfer;
// 可设置move、copy等属性值看看效果
dt.effectAllowed = 'link';
<!--修改拖放图标-->
dt.setDragImage(myIcon , 0 , 0);
dt.setData("text/plain", "www.baidu.com");
}
// 允许拖动
document.ondragover = function(e){return false;};
</script>
</body>
</html>
2.5.5改变拖放图标.html
最新推荐文章于 2022-07-21 16:33:45 发布