完整版 禁止上下左右 出界
带虚线框的拖拽块
//当鼠标按下的时候虚线框的位置没变 所以要改变虚线框的位置
oBox.style.left = oDiv.offsetLeft +"px"; oBox.style.top = oDiv.offsetTop +"px";document.body.appendChild(oBox); document.onmousemove = function(ev){ var oEvent = ev || event; var l = oEvent.clientX - disX; //块的x位置 var t = oEvent.clientY - disY;//块的y位置 if(l<0) { l = 0; }else if(l>document.documentElement.clientWidth - oDiv.offsetWidth) { l = document.documentElement.clientWidth - oDiv.offsetWidth; } if(t <0) { t = 0; }else if(t>document.documentElement.clientHeight - oDiv.offsetHeight) { t = document.documentElement.clientHeight - oDiv.offsetHeight; } oBox.style.left =l +"px"; oBox.style.top = t +"px"; }; document.onmouseup = function(){ document.onmousemove = null; document.onmouseup = null; //oDiv的left top 等于 oBox的左边距 oDiv.style.left = oBox.offsetLeft +"px"; oDiv.style.top = oBox.offsetTop +"px"; // 鼠标离开清除虚线框 document.body.removeChild(oBox); } return false;//阻止火狐bug ff下拖拽空div会出现重影 } }