The function you are calling calls slideUp for the first div and slideDown for the 2nd item. When you click it a 2nd time it won't work because the divs are already in the positions they should be (having already been slid up and down).
I think you may have better luck with the slideToggle method, which toggles the visibility of the elements. http://docs.jquery.com/Effects/slideToggle On Apr 24, 7:00 pm, adw999 <adw...@googlemail.com> wrote: > Hi, > > I have the following code: > > $(document).ready(function() { > $('.artistspanel').hide(); > $("#teamcontainer h2").click(function(){ > $('#teamcontainer div:visible').not('.hr').slideUp('slow'); > $('.'+$(this).attr("id")).slideDown('slow').show(); > }); > > }); > > Which runs with the html: > > <div id="teamcontainer"> > > <h2 id="panelone">Panel 1</h2> > <div class="artistspanel panelone"> > //content > </div> > <div class="clear hr"></div> > <h2 id="paneltwo">Panel 2</h2> > <div class="artistspanel paneltwo"> > //content > </div> > <div class="clear hr"></div> > <h2 id="panelthree">Panel 3</h2> > <div class="artistspanel panelthree"> > //content > </div> > > </div> > > It runs the slide up and slide down fine one round, but clicking the > h2 again doesn't do anything. Any suggestions?
