html PC端 拖动

该功能计划用于公司对外SDK对接，所有语法基于ES5进行编写，纯JS没有使用其它引用。
click事件会与按下弹起事件冲突所以在弹出事件触发时判断是点击还是拖动。

		var downx, downy;
        //拖动阀值
        var threshold = 10;
        function body_dom_mousemove(e) {
            if (!(downx <= e.clientX + threshold && downx >= e.clientX - threshold) ||
                !(downy <= e.clientY + threshold && downy >= e.clientY - threshold)) {
                //超过移动阀值,判定为用户在拖动悬浮球
                ym_createBall_dom.style.left = e.clientX-20 + "px";
                ym_createBall_dom.style.top = e.clientY-20 + "px";
            }
        }
        //鼠标按下时触发
        ym_createBall_dom.onmousedown = function (e) {
        	//记录原始值
            downx = e.clientX
            downy = e.clientY
            //给最外层的body添加鼠标移动事件
            body_dom.addEventListener('mousemove', body_dom_mousemove)
        }
        //鼠标弹起时触发
        ym_createBall_dom.onmouseup = function (e) {
            body_dom.removeEventListener('mousemove',body_dom_mousemove)
            if ((downx <= e.clientX + threshold && downx >= e.clientX - threshold) ||
                (downy <= e.clientY + threshold && downy >= e.clientY + threshold)) {
                //未超过阀值判定为点击
                if (_ym.IsLoginSuccess() && _ym.GetIsRealName() && !_ym.data.is_iframe_lock) {
                    _ym.iframeSrc(
                        "suspensionBall/suspensionBall?token=" + _ym.data.token
                    );
                }
                onclick();
            }else{
                //获取鼠标按下的坐标
                var x = e.clientX > body_dom.clientWidth / 2 ? body_dom.clientWidth - 32 : 0;
                ym_createBall_dom.style.left = x+ "px";
            }
        }

效果

手机端拖动代码
手机端简单很多直接用触摸事件就好了

 /*触摸开始*/
        ym_createBall_dom.ontouchmove = function (e) {
            var changedTouches = e.changedTouches[0];
            //获取鼠标按下的坐标
            var x = changedTouches.clientX > 0 ? changedTouches.clientX : 0;
            var y = changedTouches.clientY > 0 ? changedTouches.clientY : 0;
            ym_createBall_dom.style.left = Number(x).toFixed(0) + "px";
            ym_createBall_dom.style.top = Number(y).toFixed(0) + "px";
        };
        /*触摸结束事件*/
        ym_createBall_dom.ontouchend = function (e) {
            var changedTouches = e.changedTouches[0];
            //获取鼠标按下的坐标
            var x =
                changedTouches.clientX > body_dom.clientWidth / 2 ?
                    body_dom.clientWidth - 32 :
                    0;
            ym_createBall_dom.style.left = Number(x).toFixed(0) + "px";
        };