javascript实现的元素拖动函数宿主为浏览器
投稿:whsnow
这篇文章主要介绍了javascript实现的元素拖动,将相应的元素对象的引用传到函数中
//宿主为浏览器 //将相应的元素对象的引用传到函数中 function candrag(drager) { drager.onmousedown = function (down) { var offx = drager.offsetLeft var offy = drager.offsetTop; var offxl = down.clientX - offx; var offyl = down.clientY - offy; window.condition = 0;//为window添加了condition属性,用于解决和click之间的矛盾 document.onmousemove = function (move) { drager.style.left = move.clientX - offxl + "px"; drager.style.top = move.clientY - offyl + "px"; drager.style.cursor = "move"; condition = Math.abs(move.clientX - down.clientX) + Math.abs(move.clientY - down.clientY); } } drager.onmouseup = function () { document.onmousemove = null; draggerr.style.cursor = "auto"; } } /*对于和click之间的矛盾解决,需要判断condition *例如: candrag(dragger); d01.onclick = function () { if (!condition) { d01.style.backgroundColor = "red"; } } *其中,d01为dragger的子元素 */