Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Simple jQuery Accordion Menu - HELP!

    Hit a snag here, I've put together a rather simple accordion menu but am having trouble getting the visible menus to "slideUp" when another sibling <li> is selected (aka, do the accordion thing). The initial "hide" and "slideToggle" function to make them go up and down works just fine.

    I'm using this format for the menu:

    <div class="accordion">
    <ul>
    <li><a href=#">NAV LINK #1</a>
    <ul>
    <li><a href=#">second level link #1</li></a>
    <li><a href=#">second level link #1</li></a>
    <li><a href=#">second level link #1</li></a>
    <li><a href=#">second level link #1</li></a>
    </ul>
    </li>
    <li>NAV LINK #2...


    <script type="text/javascript">
    $(document).ready(function() {
    $('div.accordion> ul ul').hide();
    $('div.accordion> ul li a').click(function() {
    $(this).next('ul').slideToggle('fast')
    .siblings('ul:visible').slideUp('fast'); //THIS IS WHERE I'M STUCK
    });
    });
    </script>

    Any help would be GREATLY appreciated!

    Thanks!
    Matt

  • #2
    Senior Coder
    Join Date
    Jan 2005
    Location
    Memphis, TN
    Posts
    1,785
    Thanks
    8
    Thanked 131 Times in 129 Posts
    Code:
    <script type="text/javascript">
    $(document).ready(function() {
    $('div.accordion> ul ul').hide();
    $('div.accordion> ul li a').click(function() {
    $(this).next('ul').slideToggle('fast').parent('li').siblings('li').children('ul:visible').slideUp('fast'); //THIS IS WHERE I'M STUCK
    });
    });
    </script>

    Code:
    $(this).next('ul').slideToggle('fast').parent('li').siblings('li').children('ul:visible').slideUp('fast');
    so find the parent of the clicked "a" which is a "li". Then look for it's siblings (other "li"s). Then look for all their children "ul"s that are visible and slide them up.

    make sense?
    Last edited by harbingerOTV; 09-08-2010 at 10:29 PM.
    Stop making things so hard on yourself.
    i is tugbucket :: help raise tugburg :: Whitehaven Kiwanis

  • #3
    New to the CF scene
    Join Date
    Jul 2008
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Ahhh!

    Yeah makes total sense, I don't think I was going to come to that conclusion myself though. Works great! I really appreciate the quick response.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •