Jquery animate function with a callback

Jquery animate function with a callback alert once the animation has completed

html


<!DOCTYPE html>
<html>
<head>
<script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
  article, aside, figure, footer, header, hgroup, 
  menu, nav, section { display: block; }
  .box { width:100%; height:400px; display:block; background:#000; }
</style>
  <script src="http://amcanu.users36.interdns.co.uk/wp-content/themes/amcanu/js/jquery-color.js" type="text/javascript"></script>
</head>
<body>
  <div class="box">Hello World</div>
</body>

jquery


$(".box").animate({'width':'100%', 'height':'40px', 'bottom':'0', 'left':'0', backgroundColor: 'yellow', 'filter': 'alpha(opacity=100)', '-moz-opacity': '1', '-khtml-opacity':'1', 'opacity':'1'}, {duration:3000, complete: function
(){ alert('done'); } });