Skip navigation
port4u
Currently Being Moderated

Want to get spry accordion panel to remain open while on a page in that section

Apr 17, 2013 6:39 AM

Tags: #sprywidget.js

Is there a way to get spry accordion tab to remain open while on a page in a section? For example, If I am in the "information section" panel and I click on a link (references.html) I want the accordion menu to remain open until I go to a new menu panel. Can this be done with this Spry accordion widget? 

 
Replies
  • Currently Being Moderated
    Apr 17, 2013 5:51 PM   in reply to port4u

    Does this http://backyardfurniture.com.au/ help you? The menu on the left has been constructed using the SpryAccordion. By viewing the source code you can see how it was done.

     
    |
    Mark as:
  • Sudarshan Thiagarajan
    4,000 posts
    Oct 15, 2010
    Currently Being Moderated
    Apr 17, 2013 10:34 PM   in reply to port4u

    To add to Ben's response, you can take a look at a list of possible Spry Accordion implementations here: http://adobe.github.io/Spry/samples/accordion/AccordionSample.html

     

    On a sidenote, Spry has been deprecated and is no longer officially supported or actively developed by Adobe: http://blogs.adobe.com/dreamweaver/2012/08/update-on-adobe-spry-framew ork-availability.html

     

    While all implementations of Spry will continue to work normally, I'd definitely recommend that you look up some jQuery plug-ins that can do this for you - it is the way ahead the way I see it.

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 19, 2013 9:47 AM   in reply to port4u

    If you supply a link to your site, I will give you a tailor made solution

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 19, 2013 10:15 AM   in reply to port4u

    In the documents (pages) near the bottom of the document you will see a line similar to

    var acc1 = new Spry.Widget.Accordion("acc1", { useFixedPanelHeights: false, defaultPanel: -1 });

    For each document in the 'ABOUT LSNY - PUBLICATIONS' panel, change the value to 1

    For each document in the 'MEMBERSHIP - CONTACT' panel, change the value to 2

     

    And so forth for each panel

     
    |
    Mark as:
  • Currently Being Moderated
    Apr 19, 2013 4:03 PM   in reply to port4u

    Looks like you have fixed it.

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 2, 2013 5:14 AM   in reply to Ben Pleysier

    I have a similar question to port4u, but my pages are all based on a template with the Accordion in that template, as a non-editable region.  Is there a way to keep the accordion panel open while on a page in that section in this case?  If not, what is the easiest way to reconfigure the pages to allow for this functionality?

     

    My site is currently being tested on another domain I use for my Mom's 'Mimi Camp' site.  Hopefully she doesn't notice until I launch the site on the correct domain.  http://mimicamp.org

     

    Thanks!

     

    --MK Toothman

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 2, 2013 5:16 AM   in reply to Lorica Gardener

    Forgot to mention - not all the pages are clickable yet.  But if you look in the "About ASA" section, those pages are all functional.

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 2, 2013 6:08 AM   in reply to Lorica Gardener

    Place the constructor in an editable area and add de default panel for each page as in

    <div id="bottomrow">

    <!-- InstanceBeginEditable name="secondary_content" -->

    *ASA is not an entity of the Catholic Diocese of Raleigh.

    <script type="text/javascript">

    var Accordion1 = new Spry.Widget.Accordion("Accordion1", { useFixedPanelHeights: false, defaultPanel: 2 });

    </script>

    <!-- InstanceEndEditable -->

    </div>

    The example will open the third panel (About ASA)

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 8, 2013 2:24 PM   in reply to port4u

    Sorry, I know this is a stupid question, but how do you name each section a number?  You can see from my code that I tried to do it by changing the class "AccordionPanel" to a number "-1" through "5" for each of the panels.  That doesn't seem to do anything.  The accordion closes when I get to the History page (this is the only page I've tried fixing with the suggested code). 

     

    mimicamp.org/history.html

     

    Every other page just defaults to the first panel being open.

     

    Thanks for your help!

     
    |
    Mark as:
  • Currently Being Moderated
    Jul 8, 2013 5:42 PM   in reply to Lorica Gardener

    Got it!  I had forgotten to remove the default script from the uneditable region of the template.  Working very nicely now!  Thank you so much!

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points