Question

I am using the following script for a jquery accordion:

(function($) {

  var allPanels = $('.accordion > dd').hide();

  $('.accordion > dt > a').click(function() {
    allPanels.slideUp();
    $(this).parent().next().slideDown();
    return false;
  });

However, when I click on a title to close it, it closes and then imediately opens again. Script can be seen working here: http://www.one-event.org.uk/wordpress/#!/programme

So my question is, how can I make the active panel close when I click it again, rather than close and open straight away?

Answer 1

It immediately opens again as that is what your code is saying to do

allPanels.slideUp(); // Hide the panel
$(this).parent().next().slideDown(); //Show it again

replace those lines with

allPanels.not(this).slideUp(); //hide only ones that aint this one.
$(this).parent().next().slideToggle(); //show or hide based on current display