Question

I am trying to write an if/else statement that will hide my .thumb <div>s whenever the “about” or “contact” links are clicked. I want all of the .thumb <div>s to slide up.

http://dl.dropbox.com/u/14080718/Final/UITabs15.html

I don’t have much experience writing if/else statementsI cant seem to figure out the right syntax any help you can give would be much appreciated.

        $(function(){
    $('.thumb').hide();

    $('.subnav').click(function(){
        var $menuelement = $('.thumb').eq($(this).closest("li").index());//find the matching nth element in the menu
        if($menuelement.hasClass('active')){//if clicked element is already expanded

            $menuelement.removeClass('active').slideUp();//remove the active class and hide it

        } else {//otherwise,clicked element is not already expanded...

        if ($('.active').length>0) {//...but another element is expanded
            $('.active').removeClass('active').slideUp( function(){
                $menuelement.addClass('active').slideDown();//add the active class and show it
            });

            } else {//another element is not expanded

            $menuelement.addClass('active').slideDown();//add the active class and show it

            }
        }
    });

    });

Answer 1

I can’t try this because it’s a bit orphaned, but try the following (or at least the following idea). I was confused because your link didn’t actually include the code you posted. Try posting a jsfiddle with the code if you’re still having problems.

Your ($(‘.active’).length>0) statement doesn’t need the >0 part – all no-zero lengths will return true.

    $(function(){
        $('.thumb').hide();
        $('.subnav').click(function(){
            var menuelement = $('.thumb').eq($(this).closest("li").index());//find the matching nth element in the menu
            $(menuelement).toggleClass('active').slideToggle();
            $('.active').not(menuelement).removeClass('active').slideUp();
        });
});