JQuery promises to function with every ()

I am trying to call my own function and wait until it ends. After the transition is complete, I want to run the following function. please see my jsfiddle http://jsfiddle.net/hrm6w/

The console .log ("top end") should start after console.log ("promise is over"), and all animations are over.

And after all the animations in each object have ended, I want to start the following actions (functions).

I think the promise () function is all I need, but I just don't get this job.

Any help would be appreciated.

+5
source share
2 answers

, , . , .

: http://hermanradtke.com/2011/05/12/managing-multiple-jquery-promises.html

: http://jsfiddle.net/lucuma/hrm6w/5/

    (function($) {
    //Transition Out
    $.fn.ajaxTransitionOut = function() {

        var $animators = $('.animate', this);
        $animators.each(function() {
            $(this).animate({
            left: 1000,
            opacity: 0
        }, 400);
        console.log('animating');
                        });
        return $animators.promise().done(function() {
            console.log('promise finished');
        });

    };

})(jQuery);

$(document).ready(function() {
    console.log('starting');
    $.when($('#content').ajaxTransitionOut()).done(function() {
        console.log('upper finished');
    });
    console.log('ending');

});​
+3

, :

(function($) {
    $.fn.ajaxTransitionOut = function() {
        return this.find('.animate').each(function() {
            $(this).animate({
                left: 500,
                opacity: 0
            }, 4000);
        });
    };
})(jQuery);
$.when($('#content').ajaxTransitionOut()).done(function() {
    $('html').css('backgroundColor','#999');
});

Fiddle - http://jsfiddle.net/hrm6w/8/

, , .

, , , , jQuery, ( .done() ).

, , type 'fx' (. .promise()).

Edit:

.when() .promise() :

$('#content').ajaxTransitionOut().promise().done(function() {
    $('html').css('backgroundColor','#999');
});

.

+1

All Articles