jQuery .click .animate to move down, then back up

Question

So far I managed to make it so it moves down on a click in increments of 120, but I want it to go up and down, not down and down... I hope I've explained this so "someone" will understand.

  <script>
  $(document).ready(function() {
    $('#footertab').click(function() {
      $('#footer').animate({
        bottom: '-=120'
      }, 1000, function() {
        // Animation complete.
      });
    });
  });
  </script>

Answer 1

If I get this right, you're looking to toggle the position of the footer. This can be done with the .toggle()-function:

$(document).ready(function() {
  $('#footertab').toggle(function() {
    $('#footer').animate({
      bottom: '-=120'
    }, 1000);
  },function() {
    $('#footer').animate({
      bottom: '+=120'
    }, 1000);
  })
});

Answer 2

You can use .toggle() for this:

$(function() { //shortcut for $(document).ready(function() {
  $('#footertab').toggle(function() {
    $('#footer').animate({ bottom: '-=120' }, 1000);
  }, function() {
    $('#footer').animate({ bottom: '+=120' }, 1000);
  });
});

By using .toggle(), every click event toggles between running the -= and += animations. Also note there's no need to include the animation callback if it doesn't do anything, just leave it off.