实例：拖拽（面向对象）
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了实例：拖拽（面向对象）相关的知识，希望对你有一定的参考价值。
<style>
#div1 {width: 100px; height: 100px; background: red; position: absolute;};
</style>
<script>
var oDiv = null;
var disX = 0;
var disY = 0;
window.onload = function()
{
oDiv = document.getElementById(‘div1‘);
oDiv.onmousedown = fnDown;
};
function fnDown(ev)
{
var oEvent = ev||event;
disX = oEvent.clientX - oDiv.offsetLeft;
disY = oEvent.clientY - oDiv.offsetTop;
document.onmousemove = fnMove;
document.onmouseup = fnUp;
};
function fnMove(ev)
{
var oEvent = ev||event;
oDiv.style.left = oEvent.clientX-disX + ‘px‘;
oDiv.style.top = oEvent.clientY-disY + ‘px‘;
};
function fnUp(ev)
{
document.onnousemove = null;
document.onmouseup = null;
};
</script>
<body>
<div id="div1"></div>
</body>
以上是关于实例：拖拽（面向对象）的主要内容，如果未能解决你的问题，请参考以下文章