tag:blogger.com,1999:blog-7813878360511369451.post5379634954651647124..comments2012-04-23T13:13:07.880-07:00Comments on arithma's development: Javascript ExplorationsAnonymoushttp://www.blogger.com/profile/02339959993106473526noreply@blogger.comBlogger1125tag:blogger.com,1999:blog-7813878360511369451.post-25263489195065461822011-05-10T00:47:40.945-07:002011-05-10T00:47:40.945-07:00jquery has one setInterval, that manages all its i...jquery has one setInterval, that manages all its internal "timers".<br />every time you call animate(..) function a new internal "timer" is created and pushed onto a queue of "timers"<br />the interval (defined by default to 13ms) runs the timer step function to step a unit until the "end" of a timer is reached, then the timer will be removed from the queue<br /><br />when the queue is empty, the interval is cleared.<br />when an animation is called and the interval is cleared, a setInterval is called (just once).<br /><br />you can also analyze the jquery code:<br />http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.js<br /><br />checking the function [b]animate[/b], you can see it calls the function [b]custom [/b] for every property:<br />[code]jQuery.each( prop, function( name, val ) {<br />...<br />e.custom( start, end, unit );[/code]<br />then custom function:<br />[code]custom: function( from, to, unit ) {<br /> var self = this,<br /> fx = jQuery.fx;<br /><br /> this.startTime = jQuery.now();<br /> this.start = from;<br /> this.end = to;<br /> this.unit = unit || this.unit || ( jQuery.cssNumber[ this.prop ] ? "" : "px" );<br /> this.now = this.start;<br /> this.pos = this.state = 0;<br /><br /> function t( gotoEnd ) {<br /> return self.step(gotoEnd);<br /> }<br /><br /> t.elem = this.elem;<br /><br /> if ( t() && jQuery.timers.push(t) && !timerId ) {<br /> timerId = setInterval(fx.tick, fx.interval);<br /> }<br /> }[/code]<br />the tick function loops on the timers and calls the timer() (which actually calls the step function as defined above):<br />[code]tick: function() {<br /> var timers = jQuery.timers;<br /><br /> for ( var i = 0; i < timers.length; i++ ) {<br /> if ( !timers[i]() ) {<br /> timers.splice(i--, 1);<br /> }<br /> }<br /><br /> if ( !timers.length ) {<br /> jQuery.fx.stop();<br /> }<br /> }[/code]<br />So in summary one interval + animation queue.Joseph Saadehttps://www.blogger.com/profile/01311545720005206221noreply@blogger.com