Faire une pause en javascript, wait, sleep

Si vous faites du javascript, vous vous êtes certainement déjà posé cette question : Comment faire une pause en javascript ?

Il existe deux plugins sleep et delay, et le mix des deux 'wait' pour jquery :

Vous retrouverez tout ici : https://www.inet411.com/articles/jquery/wait-plugin.html avec des demos.

Apparemment le site est offline : voici l'article

Jquery wait plugin

I found a delay() plugin here and a pause() plugin here. Both of which were great in their own way. The pause() plugin allows for certain features that the delay() plugin does not and visa-versa.

With the pause plugin you can chain as such:


That will slide down the #some_div_id div and "pause" for 2 seconds and then slide up the #some_div_id div.

That is great but I also like to put in my own functions. ie.


The above will not work with the "pause" plugin but will work with the delay plugin as shown below:


So I simply combined both scripts and allowed for optional chain-ability, default options and a custom callback upon completion.

Here is the script. It's not the delay plugin and it's not the pause plugin - it's BOTH. What word means "pause" and/or "delay"? I guess WAIT will do. So here is the wait plugin for jQuery. Save this file as jquery.wait.js. It's about 4kb.

// Delay Plugin for jQuery
// - https://www.evanbot.com
// - copyright 2008 Evan Byrne
 * Jonathan Howard
 * jQuery Pause
 * version 0.2
 * Requires: jQuery 1.0 (tested with svn as of 7/20/2006)
 * Feel free to do whatever you'd like with this, just please give credit where
 * credit is do.
 * pause() will hold everything in the queue for a given number of milliseconds,
 * or 1000 milliseconds if none is given.
// Wait Plugin for jQuery
// https://www.inet411.com
// based on the Delay and Pause Plugin
 (function($) {
    $.fn.wait = function(option, options) {
        milli = 1000; 
        if (option && (typeof option == 'function' || isNaN(option)) ) { 
            options = option;
        } else if (option) { 
            milli = option;
        // set defaults
        var defaults = {
            msec: milli,
            onEnd: options
        settings = $.extend({},defaults, options);

        if(typeof settings.onEnd == 'function') {
            this.each(function() {
                setTimeout(settings.onEnd, settings.msec);
            return this;
        } else {
            return this.queue('fx',
            function() {
                var self = this;
                setTimeout(function() { $.dequeue(self); },settings.msec);


Sample Usage

Sample #1

default wait of 1 second:


Demo #1

Click the link, after ONE second (one second is default) the link will disappear.

Demo Link 1

Sample #2

custom wait time of 2 seconds:


Demo #2

Click the link, after TWO seconds the link will disappear.

Demo Link 2

Sample #3

slideUp,default wait 1 second,custom function on complete to slide back down:


Demo #3

Click the link, the link will immediately slideUp then wait 1 second then slideDown.

Demo Link 3

Sample #4

same as above except you can specify the time to wait instead of the default of 1 second.


Demo #4

Click the link, the link will immediately slideUp then wait 2 seconds then slideDown.

Demo Link 4

Sample #5

using options

        //do something else
        alert('It has been 2 seconds since you clicked the link.');

Demo #5

Click the link, wait for 2 seconds and you will receive a confirmation message.

Demo Link 5