Menu
I just saw this and think it's cool.
console.log("Starting...");
$("#my_element")
.fadeIn()
.delay(3000)
.fadeOut();
console.log("Finishing...");
How does the .delay method work under-the-hood? I mean, how does it figure out how to wait 3 seconds but not interrupt the main control flow?
713
delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue. Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of . show() or .
jQuery delay() Method The delay() method sets a timer to delay the execution of the next item in the queue.
To delay execution of animation, use . delay() method which allows to delay the execution of functions that follow it in the queue. It accepts duration as parameter. Durations are given in milliseconds; higher values indicate slower animations, not faster ones.
jQuery has an internal "queue" object, that is just an array:
[ nextAction,
action,
action,
lastAction ]
When you use delay, it pushes:
function delay( ms ){
setTimeout( dequeue, ms )
}
Meaning that once it gets to the delay, there's a timeout and then the next action is fired. Actions that happen immediately, like .css, however, do:
function css(){
// do stuff
dequeue();
}
no delay.
185
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
