javascript - Save Draggable Div Position -

i had added drag , move div website, using common header each pages.

my drag , move div code follows:

script:

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

div:

<div class="student_avatar_header" id="draggable" title="drag , move...">     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; } 

this drag , move function working fine, question had added draggable div header appear visit pages website, want set cookie function or possible remember last position dragged. example here home page, drag div page bottom, when go about page div appear not previous position, appear default position. need display previous position visit pages website,

note: my website have above 35 pages.

any idea.?

thanks...

have on following code :

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

to re-position element when user returns:

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