jQuery Animation not applying for a link?

I have had some help here about showing and hiding div's the following code has been created as a result, which works great, the only problem is when i click a link with the class .closepanel the slideup animation doesn't work e.g. the animation is not applied when it closes... seems strange as the closing animation does apply for clicks anywhere e开发者_开发问答lse...

Especially as it shares the function to slideup as the one that works...

$(document).ready(function(){
$('#panel').click(function(e) {
    e.stopPropagation();
  });      
  $(".panel-tab").click(function(e) {
    $("#panel").slideDown("slow");
    e.stopPropagation();
  });
  $(document,'.closepanel').click(function() {
      $("#panel").slideUp("slow");
  });
})

Now I might remember wrong. But I think that if you limit your search with an argument to JQuery, that argument should be the second argument. But since you use document you are not actually limiting it very much.

So, either of these should probably work

$('.closepanel').click(function() {
      $("#panel").slideUp("slow");
  });

or if you really want to reference the document

$('.closepanel', document).click(function() {
      $("#panel").slideUp("slow");
  });

Your argument list in the selector is the wrong way around for this line:

$(document,'.closepanel')

the context argument should be second:

$('.closepanel', document)

Which will select elements with the class closepanel in the context of document.

See: http://api.jquery.com/jQuery/ for more details on the context parameter.

Update: To select everything but .closepanel use:

$(document).Remove('.closepanel')

or

$('*:not(.closepanel)')

Then bind your event handlers.

See: http://api.jquery.com/remove/ and http://api.jquery.com/not-selector/ for more information

Update 2:

If you are wanting to build a collection to bind a handler that slides the panel up, you can:

• combine using multiple selectors: http://api.jquery.com/multiple-selector/
• use .add(selector) to add to the selected items http://api.jquery.com/add/
• create the function as a variable and bind the events seperately

You can also use one() http://api.jquery.com/one/ to bind a handler to an event to run once to prevent side effects of slideup() being called when the panel is not shown.