jQuery heartbeat animation crashes

Question

I'm trying to make a heartbeat animation with jQuery but it has some behavior I don't understand.

function pulse() {
    var target = $('body');

    target.animate({
        'font-size': '100.2%',
            'background-size': '230%'
    }, 200).delay(1600)
        .animate({
        'font-size': '100.1%',
            'background-size': '200%'
    }, 200, function () {
        window.setTimeout(pulse(), 4000);
    }).delay(200);
}

Fiddle
It seems to me that the setTimeout(pulse(), 4000); is executed inmediatly, regardless of the timeout I use. Also, when I view it on my mobile phone it crashes after a short while.

I'm not too familiar with jQuery delay method but am I doing something wrong? I'm not sure if I read my own code correctly :)

EDIT:
Updated Fiddle: It's my other code that crashes the mobile device 'click document to mute' code crashes it. Would you mind taking a glance at it and tell me if you see what might crash the phone?

Answer 1

setTimeout(pulse(), 4000); should be setTimeout(pulse, 4000);

Notice there are no parentheses after pulse.

This is because when the parentheses are present, it means the function should be evaluated (which is what causes it's immediate execution). Without them, it is a reference to a function passed as an argument to setTimeout and will only be executed when setTimeout chooses to execute it, which is what you want.