Jquery cookies, states of sliding panel problem

I have a little problem with my sliding panels, I have a Page with 2 sliding panels (right and left). These panels have a 'slide button' and you can reduce panels by clicking on it.

I use cookies to record state of panel, so when you change page panels stay collapsed or extended. But it doesn't work very well, in fact the state is recorded for the page. If I change page, panel will extend (default position) but if I go back on the page it will disapear. Is it possible to ignore the path in the cookie and use a cookie for all website? Jquery code :

$('#rightfold').click(function () {
    if ($('.menudroite').is(':visible')) {
        $('.menudroite').hide("slide", { direction: "right" }, 400);
        $.cookie('rightfold', 'collapsed');
        $('.triggerdroite').animate({ back开发者_开发技巧groundColor: "#B2C9D1" }, 1000);
        $('#rightfold').animate({ color: "#000000" }, 1000);           
    }
    else {
        $('.menudroite').show("slide", { direction: "right" }, 400);
        $.cookie('rightfold', 'extended');
        $('.triggerdroite').animate({ backgroundColor: "#6c7a7f" }, 1000);
        $('#rightfold').animate({ color: "#d9f4ff" }, 1000); 

    }

});
$('#leftfold').click(function () {
    if ($('.menugauche').is(':visible')) {
        $('.menugauche').hide("slide", { direction: "left" }, 400);
        $.cookie('leftfold', 'collapsed');
        $('.triggergauche').animate({ backgroundColor: "#B2C9D1" }, 1000);
        $('#leftfold').animate({ color: "#000000" }, 1000); 
    }
    else {
        $('.menugauche').show("slide", { direction: "left" }, 400);
        $.cookie('leftfold', 'extended');
        $('.triggergauche').animate({ backgroundColor: "#6c7a7f" }, 1000);
        $('#leftfold').animate({ color: "#d9f4ff" }, 1000); 


    }

});

// COOKIES

var leftfold = $.cookie('leftfold');
var rightfold = $.cookie('rightfold');

// Set the user's selection for the left column
if (leftfold == 'collapsed') {
    $('.menugauche').css("display", "none");

};
// Set the user's selection for the right column
if (rightfold == 'collapsed') {
    $('.menudroite').css("display", "none");

};

Thanks for responses..

If you're using the JQuery cookie plugin I'm thinking of, you can set the cookie to be available everywhere like this.

$.cookie('leftfold', 'extended', {path: '/'});

I'm not entirely certain, but I think you want to set the cookie domain to / so that it can be used across the entire domain.

I'm not sure which cookie plugin you're using, so I can't give you the specifics on how to do that.