利用jQuery实现用户登录框的拖拽功能

HTML 

<div class="box" id="box">
    <div class="hd" id="drop">注册信息 (可以拖拽)
        <span id="box_close">[关闭]</span>
    </div>
    <div class="bd"></div>
</div>

CSS样式

<style>
    .login-header { width: 100%;text-align: center;height: 30px; font-size: 24px;line-height: 30px;}
    * {margin: 0;padding: 0;}
    .box { width: 400px; height: 300px;border: 5px solid #eee;box-shadow: 2px 2px 2px 2px #666;position: absolute;top: 15%;left: 30%;}
    .hd { width: 100%; height: 25px; background-color: #7c9299; border-bottom: 1px solid #369; line-height: 25px; color: white;cursor: move;}
    #box_close {float: right; cursor: pointer;}
</style>

处理拖拽事件

<script type="text/javascript" src="jQuery-1.12.4.min.js"></script>
<script>
    $("