javascript - jQuery chaining vs. callbacks for animation functions -


say have element want animate:

$('.hey').show(1000).slideup(1000); 

what's difference between and:

$('.hey').show(1000, function() {   $(this).slideup(1000); }); 

in terms of happens internally? far know, animations asynchronous in jquery. first example, show , slideup should fire @ same time. in second, slideup should fire after show ends.

yet, reason, people on answer they're "same". why same despite (obvious) fact work different (in first example, return happen immediately, unlike second one)?

yet, reason, people on answer they're "same".

you're right, aren't. there's particularly large difference between them if more 1 element matches .hey. quoted code, although sequence of steps take different, end doing same thing.

why same despite (obvious) fact work different (in first example, return happen immediately, unlike second one)?

in both of examples, code runs , completes ("returns") immediately.

in first example, call slideup happens but jquery handles call adding slideup animation end of animation queue , returning; actual slideup happens later, when reached in animation queue.

in second example, call show happens , then, later when animation complete, call slideup done.

the key difference when multiple elements match selector in first example, there one call slideup, adds slideup operation animation queue current set of elements in jquery object called on. in second, there multiple calls completion callback, 1 each element completes.

another important difference highlighted arun p johny in the comments: if add another animation function same elements later, first example added queue after slideup, in second example slideup after other animation.

but quoted code, again, while take different roads there, end doing same thing.


Comments

Popular posts from this blog

php - Wordpress website dashboard page or post editor content is not showing but front end data is showing properly -

javascript - Get parameter of GET request -

javascript - Twitter Bootstrap - how to add some more margin between tooltip popup and element -