JQuery Animate Function
HTML
<div id="div" style="position: absolute; background: red; width: 100px; height: 100px;
border-radius: 50%;"></div>
<div id="div2" style="position: absolute; left:200px; background: green; width: 100px; height: 100px;
border-radius: 50%;"></div>
<div id="div3" style="position: absolute; left:400px; background: blue; width: 100px; height: 100px;
border-radius: 50%;"></div>
JavaScript
function animateIcons() {
$('#div').animate({'left': '200px'}, 1000, 'linear', growDiv);
$('#div3').animate({'left': '200px'}, 1000, 'linear');
$('#div3').fadeOut(1000);
$('#div2').fadeOut(1000);
}
function growDiv() {
//$('#div').show("scale",{}, 1000);
//$('#div').show("scale",{},3000).center(false, 3000);
$('#div').animate({'width': '400px', 'height': '400px'}, 1000, 'linear', growDiv);
}
animateIcons();