Site icon StartFunction

Folding WordPress menu pages

A while ago I wrote a post about creating a folding menu for WordPress built in Pages widget using only jQuery without adding or modifying any markup or PHP. A reader, Kretschmar, reported some bugs and asked if it could work for more than one level.

After modifying the jQuery code, now it works for multi level depth page hierarchies.

Here’s the jQuery code:

[code language=”js”]
jQuery(document).ready(function($){

var $thisPage = $('.current_page_item');

$thisPage.each(function(){
    var $self = $(this);

    $('ul:first', $self).slideDown();

    $self.parents('ul, li').map(function () {
        $(this).slideDown();
    });

});

});
[/code]

add the CSS for your stylesheet:

[code language=”css”]
.page_item ul {
display: none;
}
[/code]

So, after sliding down the first parent and getting all parents of current_page_item, we  slide down each parent level by level until the list is empty.

Exit mobile version