实现浮动迷你窗口的随意拖拽及贴边悬浮

有时候在其他网页的界面上我们可以看到一些浮动的帮助窗口，这些窗口可以自由拖动，而且在你想要把它拖出窗口外的时候自动贴合吸附在窗口的边界，下面来看一下具体的效果（很简陋地实现了一下，别笑hh）：

        其实要实现这个效果看上去是很简单的，但是对于第一次制作这种效果的小白来说，还是有几个小小的地方是有些困惑的。下面我们就一起来看一下如何实现这个：

首先，我们来制作一个简单的迷你小窗口

<div id="panel" draggable="true">
    <img src="../src/girl.png" />
    <div id="inner">
        <span>会员</span>
        <span>黄钻</span>
    </div>
</div>

        这里注意需要把整个div的draggable属性设置为true，这是html5新加入的属性，让我们自定义可以拖拽的元素。然后给他们加上样式：

html,body {
    margin: 0;
    padding: 0;
    height: 100%;
}
#panel {
    position: abso