jQuery 1.4 Animation Techniques Beginner's Guide

Time for action – adding event handlers for the UI elements

Now that the slider has been created, we can add the event handlers that will drive the functionality:

$("#ui li a").not(prevChild).not(nextChild).click(function(e){
  e.preventDefault();

  key = $(this).attr("href").split("#")[1];

  slide.animate({
    left: details[key].position
  }, "slow", "easeOutBack", postAnim);
});

nextChild.add(prevChild).click(function(e){
  e.preventDefault();

  var arrow = $(this).parent();

  if (!slide.is(":animated")) {
    slide.animate({
      left: (arrow.attr("id") === "prev") ? "+=400" : "-=400"
    }, "slow", "easeOutBack", function(){

      (arrow.attr("id") === "prev") ? postAnim("back") : postAnim("forward")
    });
  }
});

What just happened?

The first handler is bound to the main links used ...