Animation related doubt from the book Jquery Novice to Ninja

JavaScript
1

Hi Guys,

I have a doubt regarding chapter 3,pg 66 in this book Jquery Novice to Ninja. The example code given here for the navigation animations differ slighlty from the code archive. I don’t clearly understand the mouseout function below:-

// Mouse out function
$('#navigation_blob')
.stop(true)
.animate(
{width: 'hide'},
{duration: 'slow', easing: 'easeOutCirc', queue: false}
)
.animate(
{left: $('#navigation li:first a').position().left;},
'fast'
);
}

The code archive doesn’t use the stop function. Adding it also doesn’t make any difference. If i change the second animation part:-

.animate(
{left: $('#navigation li:first a').position().left;},
'fast'
);

from ‘fast’ to ‘slow’, i noticed that the blob doesn’t whisk back to the menu item i just hovered. It goes to the first menu item and stays there.Why is it so?
Can anyone provide proper explanation as to what exactly is going on in this mouseout event animation?

2

Hi adivenu123,

I’m afraid I missed your question the first time round and only saw it just now thanks to a spammy reply you received (which I removed).

Anyway, did you work this out in the meantime or are you still looking for an explanation?
If so, just let us know.