保存可拖動的Div位置

Question

我已經將div拖放到我的網站上，我為每個頁面使用通用標題。

我的拖放div代碼如下：

腳本：

<script type="text/javascript">
    $(function() {
        $( "#draggable" ).draggable();
    });
</script>

分區：

<div class="student_avatar_header" id="draggable" title="Drag and Move...">
    Some texts...
</div>

CSS：

.student_avatar_header {
    width: 100px;
    height: 100px;
    position: absolute;
    left: 10px;
    top: 20px;
    border-radius: 250px;
    z-index: 9998;
    box-shadow: 2px 2px 12px #008abc;
    cursor: move;
}

此拖放功能正常工作，我的問題是我已將此可拖動Div添加到標題中，因此即使訪問我的網站的任何頁面，它也將顯示，我只想設置Cookie函數或記住它拖動到的最后位置的可能性。 例如現在我在這里home ，我只是將div拖動到頁面底部，但是當我轉到about該頁面時，該div不在以前的位置，而是它的默認位置。 即使我訪問我的網站的任何頁面，我也需要它顯示以前的位置，

注意： 我的網站有35頁以上。

任何想法。？

謝謝...

Answer 1

看下面的代碼：

$("#draggable").draggable({
    stop: function(event, ui) {
        $.cookie("elementIDCookie", ui.position);
    }
});

在用戶返回時重新定位元素：

$("#draggable").css( { "left" : $.cookie("elementIDCookie").left, "top" : $.cookie("elementIDCookie").top });