jQuery toggle animation

$('.login').toggle(    function(){        $('#panel').animate({            height: "150",             padding:"20px 0",            backgroundColor:'#000000',            opacity:.8        }, 500);        $('#otherdiv').animate({            //otherdiv properties here        }, 500);    },    function(){        $('#panel').animate({            height: "0",             padding:"0px 0",            opacity:.2        }, 500);             $('#otherdiv').animate({            //otherdiv properties here        }, 500);});

I dont think adding dual functions inside the toggle function works for a registered click event (Unless I'm missing something)

For example:

$('.btnName').click(function() { top.$('#panel').toggle(function() {   $(this).animate({      // style change   }, 500);   },   function() {   $(this).animate({      // style change back   }, 500); });

Use toggle() or slideToggle from jquery:

Toggle

  $( "#clickme" ).click(function() {      $( "#book" ).slideToggle( "slow", function() {        // Animation complete.      });    }); <div id="clickme">      Click here    </div>    <img id="book" src="book.png" alt="" width="100" height="123">