How can i show panel when i click second time on link

Question

Below works fine to me when click on left side links, right side panel animating like slideUp. But When i click again on the same link, panel hides. But i dont want hide the panel. Please let me know, what i need to correct on above code.

$(function() {
    $('div.panel').hide();
    $('div.panel:first').addClass('active').show();
    $('li.link').click(function() {
        var id = $(this).attr('rel');
        var showing = $(id).is(':visible');
        $('div.panel').slideUp('slow');
        $('li.link').removeClass('active');
        if (!showing) {
            $(id).slideDown('fast', function() {
                $('html,body').animate({
                    scrollTop: 0
                }, 'slow')
            });
            $(this).addClass('active');
        }
    });
});

Answer 1

Move the .slideUp call inside the if block. You only want to do stuff if you have clicked any link other than the one that corresponds to the current page.

$('li.link').click(function() {
    var id = $(this).attr('rel');
    var showing = $(id).is(':visible');
    $('li.link').removeClass('active');
    $(this).addClass('active');
    if (!showing) {
        $('div.panel').slideUp('slow');
        $(id).slideDown('fast', function() {
            $('html,body').animate({
                scrollTop: 0
            }, 'slow')
        });
        $(this).addClass('active');
    }
});