用 js 实现的拖拽页面上的某框

 // 鼠标点击，显示遮罩层与登录框
    document.getElementById("link").onclick = function () {
      document.getElementById("login").style.display = "block";
      document.getElementById("bg").style.display = "block";
    }
    // 鼠标点击，隐藏遮罩层与登录框。
    document.getElementById("closeBtn").onclick = function () {
      document.getElementById("login").style.display = "";
      document.getElementById("bg").style.display = "";
    }
    document.getElementById("title").onmousedown = function (e) {
      // 鼠标距离左边与上边的距离=可视区域的水平和垂直距离-登录框距离左侧和上边的距离
      var spaceX = e.clientX - document.getElementById("login").offsetLeft;
      var spaceY = e.clientY - document.getElementById("login").offsetHeight;

      document.onmousemove = function (e) {
        // 当鼠标移动的时候，可视区域的距离减去空白就是left或者top值，但是会受到margin的影响。
        var X = e.clientX - spaceX + 250;
        var Y = e.clientY - spaceY - 140;     
        document.getElementById("login").style.left = X + "px";
        document.getElementById("login").style.top = Y + "px";
      }
    }
    // 当鼠标在文档中的任意位置抬起的时候，清理mouseover事件。
    document.onmouseup = function () {
       document.onmousemove=null;