Draggable positioning saved in cookies
<p>So I have a div, cguts, that has visibility toggled using jquery and is draggable on the screen. I have managed to figure out how to use cookies to get the visibility to be persistent, but I can't seem to get a handle on how to get the div's position to also be persistent throughout the site.</p>

<p>The following code works for everything except for saving the position of the div from one page to the next.</p>

<pre><code>$(document).ready(function () {   
        var cookieName = 'cvis';

        function setCookie(key, value) {
            var expires = new Date();
            expires.setTime(expires.getTime() + 31536000000); //1 year 
            document.cookie = key + '=' + value + ';expires=' + expires.toUTCString();
        }

        function getCookie(key) {
            var keyValue = document.cookie.match('(^|;) ?' + key + '=([^;]*)(;|$)');
            return keyValue ? keyValue[2] : null;
        }
        if (getCookie(cookieName) === '1') {
            $('#cguts').show();
            $('#cguts').draggable(function(event, ui) {
             var currentPos = $(this).position();
             var currentTop = Math.round(currentPos.top);

             // save cookie when stopped dragging
             $.cookie('position' + $(this).index('div').toString(), currentTop.toString());});
        } else if (getCookie(cookieName) === '0') {
            $('#cguts').hide();
        } else {
            setCookie(cookieName, '1');
            $('#cguts').show();
            $('#cguts').draggable(function(event, ui) {
             var currentPos = $(this).position();
             var currentTop = Math.round(currentPos.top);

             // save cookie when stopped dragging
             $.cookie('position' + $(this).index('div').toString(), currentTop.toString());});
        }
        $('.click').on('click', function () {
            if ($('#cguts').is(':visible')) {
                $('#cguts').fadeOut(300);
                setCookie(cookieName, '0');
            } else {
                $('#cguts').fadeIn(300);
                $('#cguts').draggable(function(event, ui) {
             var currentPos = $(this).position();
             var currentTop = Math.round(currentPos.top);

             // save cookie when stopped dragging
             $.cookie('position' + $(this).index('div').toString(), currentTop.toString());});
                setCookie(cookieName, '1');
            }
        });
    });
</code></pre>

<p>My question now is what am I doing wrong? I suspect the issue is in the cookie coding within draggable, but I'm officially lost...</p>