make div open/closed state persist

This is a drop down div that contains account information at the top of my page. What can I do to make the div stay open until the person manually closes it?

I want it to stay open if the page refreshes or if the person navigates to a new page EXCEPT if they click on the 'register a new account' link, then I want the div to close and the person will be redirected (via magento) to the registration page.

$(document).ready(function() {开发者_开发技巧

    // Expand Panel
    $(".open-js").click(function(){
            $("div.panel").slideDown("slow");
    }); 

    // Collapse Panel
    $(".close-js").click(function(){
            $("div.panel").slideUp("slow"); 
    });     

    // Switch buttons from "Log In | Register" to "Close Panel" on click
    $(".toggle-js a").click(function () {
            $(".toggle-js a").toggle();
    }); 

});

You could check out jQuery Cookie addon and store the state in cookies

You create cookies in JavaScript using the following syntax:

document.cookie =
  'examplecookie=amorrosa; expires=Thu, 2 Jul 2011 12:00:00 UTC; path=/'

So if you want to have a cookie set for a user when they click the register link (regardless of whether or not they actually follow through with the registration process), you'd include it in your register link click event:

// Switch buttons from "Log In | Register" to "Close Panel" on click
$(".toggle-js a").click(function () {
    $(".toggle-js a").toggle();
    document.cookie =
      'examplecookie=amorrosa; expires=Thu, 2 Jul 2011 12:00:00 UTC; path=/'
}); 

You can include any type of name/value pair in that cookie information, so instead of "examplecookie=amorrosa" you might have "myuserinformation=user.name" or some such value.

To decide whether or not to show your div, you'd see if the cookie exists, read its value (or you might simply only check to see if your cookie exists and show the div if it does) and show the div:

if(document.cookie) {
   index = document.cookie.indexOf('examplecookie');
   if (index != -1) {
       $('#myDiv').show();
   }
}