javascript - Mechanism of Recursive Callbacks -

javascript - Mechanism of Recursive Callbacks -

see fiddle: http://jsfiddle.net/ym1alk25/9/

var s = $('#shake'); var randomtran = function (flag) { flag = flag || 0; if (flag < 6) { var rh = math.floor((math.random() * 10) - 5), rv = math.floor((math.random() * 10) - 5); s.transit({x: rh,y: rv}, 50, randomtran.bind(this, ++flag)) }; }; randomtran(); s.transit({x: 0,y: 0});

i'm trying create element shake few seconds , homecoming original position. doesn't work expected, problem callback function. according question: if jquery function calls in completion callback, recursive danger stack?, seems while callback still looping, codes come after callback function beingness executed. how accomplish goal, other setting timeout? , can find more detailed explanation mechanism?

your fiddle working expected, , animations queued (they queued if .transit() called multiple times repeatedly, plugin uses jquery's internal animation queue). thing 50 milliseconds animation on 5 pixels much fast. i've increased time , printed counter in revision of fiddle.

it seems while callback still looping, codes come after callback function beingness executed.

there no "looping callback". callback passed function returns before callback called - , code called .transit() continues (which, in case, closing } brace if, end of randomtran() call, , s.transit({x: 0,y: 0}); initialisation.

once code has finished executing, other code can executed - asynchronously. callback stored somewhere - in future, 50ms after transit() phone call - beingness called; start transition, schedule callback, , ends.

javascript recursion callback