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的子元素
*/

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章