天天看點

touchmove時滑鼠點選的位置調整

平時用H5做小遊戲時,經常會用到 addEventListener("touchmove",touch),在滑鼠或手勢 移動的時候,如果遇到比較大的素材,需要調整滑鼠或手勢在素材上的位置。

隻需要在touches擷取的值進行加減即可,再把改變後的值進行渲染

curX = e.touches[0].pageX - 90;   //改變移動是手的位置
        curY = e.touches[0].pageY - 90;   //改變移動是手的位置

        $("#touch").css({
            "left": curX,
            "top": curY
        });
           
另外,最好做移動的邊界判斷處理,使用改變後的X和Y值,通過加減數字來控制想要的邊界範圍      
curX = curX < 50 ? 50 : curX;
        curY = curY < 50 ? 50 : curY;
        curX = curX < document.documentElement.clientWidth - 50 ? curX : document.documentElement.clientWidth - 50;
        curY = curY < document.documentElement.clientHeight - 50 ? curY : document.documentElement.clientHeight - 50;