Question

I’m trying to get it so that upon clicking the pre-defined link, the content section will slide down and the other sections will slide up. I understand I could use JQuery callbacks for this, but for some reason, it always appears to try to slide the box up and then starts to bring it down (so it creates an odd jerky effect).

The JQuery can be seen here:

$("#welcome_link").click(function () {
  $("div[id$='_content']").slideUp('fast', function() {
    $("#welcome_content").slideDown('fast');
  });
});

Is there something I’ve done wrong here? I thought this would work.

Thanks!

Answer 1

You start to slide it up along with the other divs, then slide it back down in the callback function; just eliminate it from the first matched set using .not().

$("#welcome_link").click(function () {
  $("div[id$='_content']").not('#welcome_content').slideUp('fast', function() {
    $("#welcome_content").slideDown('fast');
  });
});​