SOURCE

console 命令行工具 X clear

                    
>
console
window.onload = function() {
  var pingmuw = document.documentElement.clientWidth;
  var pingmuh = document.documentElement.clientHeight;

  var box = document.getElementById('box');
  var btn = box.getElementsByTagName('button')[0];
  var x = 8;
  var y = 8;

  var maxw = pingmuw - box.offsetWidth;
  var maxh = pingmuh - box.offsetHeight;

  var ad = function() {
    var laoleft = box.offsetLeft;
    var laotop = box.offsetTop;
    var xinleft = laoleft + x;
    var xintop = laotop + y;
    if (xintop > maxh) {
      xintop = maxh;
    }
    if (xinleft > maxw) {
      xinleft = maxw;
    }
    if (xinleft < 0) {
      xinleft = 0;
    }
    if (xintop < 0) {
      xintop = 0;
    }
    box.style.left = xinleft + 'px';
    box.style.top = xintop + 'px';
    if (xintop == maxh) {
      y = -8;
    }
    if (xintop == 0) {
      y = 8;
    }
    if (xinleft == maxw) {
      x = -8;
    }
    if (xinleft == 0) {
      x = 8;
    }
  }
  var timer = setInterval(ad, 20)

  box.onmouseover = function() {
    clearInterval(timer);
  }
  box.onmouseout = function() {
    timer = setInterval(ad, 20)
  }
  btn.onclick = function() {
    box.style.display = 'none';
  }
}
<div id="box">
  <button>
    删除
  </button>
</div>
* {
  padding: 0;
  margin: 0;
}

#box {
  width: 300px;
  height: 200px;
  background: red;
  position: relative;
}

#box button {
  position: absolute;
  top: 2px;
  right: 2px;
  background: #fff;
  color: red;
  width: 50px;
  height: 30px;
  text-align: center;
  line-height: 30px;
}