<html>
<head>
<title>JavaScript实现Html元素的拖拽</title>
<script language=javascript>
var diffx,diffY;
var objDiv;
function beginDrag()
{
objDiv = document.getElementById("div1");
diffX = event.clientX -objDiv.offsetLeft;
diffY = event.clientY - objDiv.offsetTop;
document.body.attachEvent("onmousemove",mousemove);
document.body.attachEvent("onmouseup",removeEvent);
}
function mousemove()
{
objDiv.style.left = event.clientX-diffX;
objDiv.style.top =event.clientY-diffY;
}
function removeEvent()
{
objDiv = window.event.srcElement;
document.body.detachEvent("onmousemove",mousemove);
document.body.detachEvent("onmouseup",removeEvent)
}
</script>
</head>
<body>
<p >JavaScript实现DIV的拖拽<div id="div1" style="background-color:Blue; width:100px; height:100px; position:absolute;" οnmοusedοwn="beginDrag()"></div></p>
</body>
</html>
1784
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
