jQuery and cookies...

[Aureole]

When I click on the a element with an id of toggle_menu_1, it just toggles the div with an id of menu_1... simple enough. Now what I'd like to do, is remember whether or not the div was showing.

 

If the user clicks on it to hide it, then I'd like to set a cookie, so that next time they load the page it will still be hidden.

 

Should they click on it again (to show it) the cookie should be erased (or changed) so that next time they load the page it will still show.

 

I found a Cookie Plugin for jQuery if that helps.

 

Here's my Javascript at the moment:

 

$('#toggle_menu_1').click(function() { $('#menu_1').slideToggle(300); return false; } );

 

Then the HTML looks like this...:

<div class="menu_title"><a href="#" id="toggle_menu_1" class="cat_title_a">Click To Toggle</a></div>
<div id="menu_1" class="menu_inner">
    <div class="menu_item">Item #1</div>
    <div class="menu_item">Item #2</div>
    <div class="menu_item">Item #3</div>
</div>

 

I've tried experimenting with it myself, I got it to set the cookie and check if it was there but it just wouldn't work at all.

 

Thanks a lot.

[Aureole]

Anyone have any ideas?

[nogray]

I am not very familiar with JQuery, but you can do something like this

 

When the user click on a toggle link, the script will slide down the div and save a cookie with the toggler id (importent)

 

next time when the page load, check if the cookie is saved. If so, fire the toggler click event (that's why saving the toggler id is importent). Make sure it's not the first toggler, otherwise it might close it