Question

I have divs that are initially closed. The code below then controls the opening/closing:

$("p:contains('INVESTOR')").click(function() {
        if( $('#cs_investorServ').is(':hidden')) {
                $('#cs_investorServ').animate({opacity:'toggle', height: 'toggle'},'fast', function(){
                $('#cs_furlBar1 .cs_furlHeaderClosed').removeClass().addClass('cs_furlHeaderOpen');
                });

     } else {
                $('#cs_investorServ').animate({opacity:'toggle', height: 'toggle'},'fast', function(){
                $('#cs_furlBar1 .cs_furlHeaderOpen').removeClass().addClass('cs_furlHeaderClosed');});
                }
    });

My issue now is that there is a link within the div that is shown/hidden which takes a user to a different page w/more information. So, if the user returns to the first page, the div is shut again because I run a hide() on all divs initially. (client mandate)

How can I save the fact that a div is ‘opened’ upon returning to that page? I’m wondering if I can use the data method but not sure how I would construct that.

Since I have an if/else that checks for is:hidden, I just thought that another if/else would interfere with the if/else for hidden.

So, I want to toggle opening a div, then upon clicking inside that div and going to another page, when coming back to the original page, have the div where the click originated still be open.

I have this as the first action in the doc ready function: $('.cs_hideOpen').hide(); so not sure how to ‘remove’ that class but only when a user has shown a div and clicked from that div.

Answer 1

There is a plugin for jquery to allow you to set, read, and delete cookies – makes it easier then setting cookies via javascript. Find the plugin Here.

Just set the cookie when the div is unhidden. You can check for that cookie every time the page is loaded.