CODEWITHSUNDEEP
jqueryhtmlnavigationhtml-lists
gundra
gundra

Reputation: 171

Jquery - how to wrap navigation submenu into div, and get it work proper

I am building jquery navigation that dynamically load external pages. Submenu appears on click, and disappears when other button is clicked. Like this everything works fine:

http://jsfiddle.net/gundra/ubTzp/1/

But when i try to insert submenu into div:

http://jsfiddle.net/gundra/ubTzp/3/

it shows up only one time, untill it disapears completley.

I'd like to see that submenu behaves like on first example, but wrapped into pageSubItems div.

Jquery:

$(document).ready(function(){


    $('#pageWraper').css({'display':'none'}).slideDown('fast');
    $('ul.submenu').hide();

    $('a.menuLink').on("click", function(event) {
        var pageLink = $(this).attr('href'); 
        var pageName = $(this).attr('name');
        var currentSub = $(this).next('ul.submenu');
        event.preventDefault();


         $(".currentPage").fadeOut('slow', function(){
             $("#pageWraper").load(pageLink);
         });

         $('#navigationWraper li a').removeClass('current');
         $(this).addClass('current');
         $('.pageName').text(pageName);


        $('a.menuLink').next('ul.submenu').removeClass('activeSub').hide();
        $('.pageSubItems').empty();
        currentSub.addClass('activeSub').show().appendTo('.pageSubItems');

    });

});

Thanks

Upvotes: 0

Views: 102

Answers (1)

Jithin Lukose
Jithin Lukose

Reputation: 344

If you press First time, 

currentSub.addClass('activeSub').show().appendTo('.pageSubItems');

sub menu move to ('.pageSubItems') class. There is no sub menu for next click.

Try This.

 $('a.menuLink').next('ul.submenu').removeClass('activeSub').hide(); 
    $('.pageSubItems').empty(); 
currentSub.clone().addClass('activeSub').show().appendTo( ".pageSubItems" );

Sorry for my English.

Upvotes: 1

Related Questions