Jump to content

Accordion Save State After Referesh


Recommended Posts

Any help on this would been very much appreciated. I am trying find a way to save the state of the JQuery accordions on my webpage after a user refreshes or changes webpages within my website. I have tried installing different scripts and downloading different cookie plugins but they either don't work or breaks all of the jquery functions on my webpage. Thank you.



This is in my header 

<link rel="stylesheet" type="text/css" href="css/styles.css">
<link rel="stylesheet" type="text/css" href="css/jquery-ui.css">
<script src="js/jquery.js"></script>
<script src="js/jquery-ui.js"></script>
<script type="text/javascript" src="Cookies/jquery.cookie.js"></script>

My Html

<div id="History">
<p>Today In History</p>
<script type="text/javascript" src="http://rss.brainyhistory.com/link/historyevents.js"></script><small><i>more <a href="http://www.brainyhistory.com/" target="_blank">History</a></i></small>

This is my original JQuery code

$( "#History" ).accordion({
collapsible: "true",     
heightStyle: "content"
Link to comment
Share on other sites

You'd have to either use the new html5 local storage method and have an if() in your jquery to check the status of that OR do the same kind of method with php sessions.  The later will require an ajax call to set the session everytime they select a accordion option.

Link to comment
Share on other sites

I have no idea how to do either. Is there a script or demo that you know of?


It's not easy, and it's a native-JS tutorial, but it is described here. On the other hand, it uses cookies, which would be easier than the PHP method.

Edited by Frank P
Link to comment
Share on other sites

This thread is more than a year old. Are you sure you have something important to add to it?

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.