账号密码登录
微信安全登录
微信扫描二维码登录

登录后绑定QQ、微信即可实现信息互通

手机验证码登录
找回密码返回
邮箱找回 手机找回
注册账号返回
其他登录方式
分享
  • 收藏
    X
    通过JS模拟Win10桌面的拖拉框选,只实现了一个方向的框选,如何实现多方向的框选呢
    • 维姐,不接语音请打字2020-01-01 00:00
    77
    0

    如题,目前只能往右下角拖拉,而不能往其他方向拉,我想实现Win10桌面一模一样的拖拉,不知道算法改怎么写了。

    下面是已经写好的JS,有大佬看下怎么改进,才能实现和Win10桌面一样的拖拉呢

    [JavaScript]

    var Mil = false;
    var NewDiv = document.createElement('div');
    
    function getMousePos(event) {
        var e = event || window.event;
        var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
        var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
        var x = e.pageX || e.clientX + scrollX;
        var y = e.pageY || e.clientY + scrollY;
        return { 'x': x, 'y': y };
    }
    function  Mi(e) {
        document.body.appendChild(NewDiv);
        NewDiv.id = 'Move_div';
        move_div = document.getElementById("Move_div");
        var m_down_x = getMousePos(e).x;
        var m_down_y= getMousePos(e).y;
        move_div.style.left = m_down_x + "px";
        move_div.style.top = m_down_y + "px";
        move_div.style.width = m_down_x - parseInt(move_div.style.left) +"px";
        move_div.style.height = m_down_y - parseInt(move_div.style.top) +"px";
        Mil = true;
    
    }
    function move(e){
        if(Mil){
            move_div = document.getElementById("Move_div");
            var m_move_x = getMousePos(e).x;
            var m_move_y= getMousePos(e).y;
            move_div.style.width = m_move_x - parseInt(move_div.style.left) +"px";
            move_div.style.height = m_move_y - parseInt(move_div.style.top) +"px";
        }
    }
    function up(){
        Mil = false;
        document.body.removeChild(document.getElementById("Move_div"));
    }

    [Html]

    <body  onmousemove="move(event)" onmouseup="up()" onmousedown="Mi(event)">

    [Css]

    #Move_div{
        background-color: rgba(162, 204, 242, 0.35);
        box-shadow: 0 0px 0.1px 0 rgba(255, 255, 255, 0.88);
        position: fixed;
    }

    相关地址:
    https://blog.lfio.net/

    0
    打赏
    收藏
    点击回答
        全部回答
    • 0
    • 烈焰滔滔 普通会员 1楼
      502 Bad Gateway

      502 Bad Gateway


      nginx
    更多回答
    扫一扫访问手机版
    • 回到顶部
    • 回到顶部