Question

How to add a function which will close active div in toggle when you click on another a element from menu.

Here is code:

http://jsfiddle.net/t4JAT/

Jquery code

$(document).ready(function(){

        $(".slidingDiv1").hide();
        $(".show_hide1").show();

    $('.show_hide1').click(function(){
    $(".slidingDiv1").slideToggle();
    });

});
 $(document).ready(function(){

        $(".slidingDiv2").hide();
        $(".show_hide2").show();

    $('.show_hide2').click(function(){
    $(".slidingDiv2").slideToggle();
    });

});
 $(document).ready(function(){

        $(".slidingDiv3").hide();
        $(".show_hide3").show();

    $('.show_hide3').click(function(){
    $(".slidingDiv3").slideToggle();
    });

});​

Answer 1

Working demo http://jsfiddle.net/t4JAT/4/

Please avoid so many document ready calls you just need one in your page.

rest below should help.

code

$(document).ready(function(){

        $(".slidingDiv1,.slidingDiv2, .slidingDiv3").hide();
        $(".show_hide1,.show_hide2, .show_hide3").show();


    $('.show_hide1').click(function(){
        $(".slidingDiv2,.slidingDiv3").hide();
         $(".slidingDiv1").slideToggle();
    });


    $('.show_hide2').click(function(){
        $(".slidingDiv1,.slidingDiv3").hide();
        $(".slidingDiv2").slideToggle();
    });



    $('.show_hide3').click(function(){
        $(".slidingDiv1,.slidingDiv2").hide();
         $(".slidingDiv3").slideToggle();
    });

});​