拖拽

来源:互联网 发布:能做网站编程单位 编辑:程序博客网 时间:2024/05/16 06:59

<!DOCTYPE html>

<html>


<head>

<metacharset="UTF-8">

<title></title>

<styletype="text/css">

#div1{

width:100px;

height:100px;

background-color: red;

position:absolute;

}

</style>

</head>


<body>

<div id="div1"></div>

<scripttype="text/javascript">

varoDiv = document.getElementById("div1");

oDiv.onmousedown= function() {

vardisX = event.clientX - oDiv.offsetLeft;

vardisY = event.clientY - oDiv.offsetTop;

document.onmousemove= function(ev) {

varevObj = ev || window.event;

oDiv.style.left= (evObj.clientX - disX) + "px";

oDiv.style.top= (evObj.clientY - disY) + "px";

}

document.onmouseup= function() {

document.onmousemove= null;

}

}

</script>

</body>


</html>

0 0
原创粉丝点击