The following snippet works as expected:

function boxAnimation() {
        var dfd = $  .Deferred();
        $  ('div').fadeIn('slow', dfd.resolve);
        return dfd.promise();
    }

    $  (function () {
        boxAnimation().done(
            function () { $  (this).animate({ 'margin-top': 50 }); },
            function () { $  (this).animate({ 'margin-left': 150 }); },
            function () { $  (this).animate({ 'margin-top': 250 }); },
            function () { $  (this).animate({ 'margin-left': 350 }); }
        ).fail(function () { alert('failed'); });
    });

However in this one the differed object is neither rejected or resolved. Tell me where am I going wrong. Thanks

function boxAnimation() {
        var dfd = $  .Deferred();
        var randomNum = Math.floor(Math.random() * 5);
        $  ('div').fadeIn('slow', function () {
            if (randomNum == 1) {
                dfd.reject;
            }
            else {
                dfd.resolve;
            }
        });
        return dfd.promise();
    }

    $  (function () {
        boxAnimation().done(
            function () { $  (this).animate({ 'margin-top': 50 }); },
            function () { $  (this).animate({ 'margin-left': 150 }); },
            function () { $  (this).animate({ 'margin-top': 250 }); },
            function () { $  (this).animate({ 'margin-left': 350 }); }
        ).fail(function () { alert('failed'); });
    });

newest questions tagged jquery – Stack Overflow