title: Jquery animate - callback executing before animation is complete
body: <p>What I'd like to accomplish is for the element to expand in height, and then apply a background image once the height change is complete. I've noticed that the background image in the callback applies before the height animation is complete resulting in laggy performance. Can anyone tell me why this is?</p>
  
  <pre><code>$(document).ready(function() {
      $('#hero').animate({
          height: ($(window).height() - $("#hero").offset().top - 50) 
      }, 100, function() {
          $('#hero').css('background-image', 'url(./img/hero.jpg)');
      });
  });
  </code></pre>