Grow your CSS skills. Land your dream job.

Need help with JQuery accordion menu…

  • # October 4, 2009 at 10:13 am

    Hello,

    I have this accordion menu script written for JQuery implemented on my site:

    Code:
    function initMenus() {
    $(‘ul.menu ul’).hide();
    $.each($(‘ul.menu’), function(){
    $(‘#’ + this.id + ‘.expandfirst ul:first’).show();
    });
    $(‘ul.menu li a’).click(
    function() {
    var checkElement = $(this).next();
    var parent = this.parentNode.parentNode.id;

    if($(‘#’ + parent).hasClass(‘noaccordion’)) {
    $(this).next().slideToggle(‘normal’);
    return false;
    }
    if((checkElement.is(‘ul’)) && (checkElement.is(‘:visible’))) {
    if($(‘#’ + parent).hasClass(‘collapsible’)) {
    $(‘#’ + parent + ‘ ul:visible’).slideUp(‘normal’);
    }
    return false;
    }
    if((checkElement.is(‘ul’)) && (!checkElement.is(‘:visible’))) {
    $(‘#’ + parent + ‘ ul:visible’).slideUp(‘normal’);
    checkElement.slideDown(‘normal’);
    return false;
    }
    }
    );
    }
    $(document).ready(function() {initMenus();});

    It works very well. However, I would like to add some functionality to it. Namely, have it save the menu state between pages. I am guessing I would just tell it to add a class to the current menu, or modify this line somehow:

    Code:
    $.each($(‘ul.menu’), function(){
    $(‘#’ + this.id + ‘.expandfirst ul:first’).show();
    });

    I don’t really know how to implement this, so any help would be appreciated! Thanks!

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".