純js實現(xiàn)拖拽dom小結(jié)

   if (element) {
          element.onmousedown = function (ev: any) {
            ev.stopPropagation()
            element.style.transition =
                'hover cubic-bezier(0.25, 0.1, 0.25, 1) 0.64s';
            const disX = ev.clientX;
            const disY = ev.clientY;
            const ex = disX - element.offsetLeft;
            const ey = disY - element.offsetTop;
            // document添加鼠標(biāo)移動
            document.onmousemove = function (ev) {
              const w1 = ev.clientX;
              const y1 = ev.clientY;

              element.style.left = w1 - ex + 'px';
              element.style.top = y1 - ey + 'px'
            };
            // document添加鼠標(biāo)浮起事件
            document.onmouseup = (e: any) => {
              ev.stopPropagation()
              setTimeout(() => {
                const x = e.clientX;
                const y = e.clientY;
                document.onmousemove = null;
                document.onmouseup = null;

              }, 100);
            };

          };
        }
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容