Variabler Bereich Problem mit Javascript-Funktion

Ich versuche mit spin.js eine Funktion zu erstellen. Die Funktion lädt den Spinner, und wenn sie mit ihrem Argument erneut aufgerufen wird, stoppt sie den Spinner. Ich kann den Variablenbereich nicht richtig einstellen. Wenn ich also die Funktion zum Stoppen aufrufe, bekomme ich eine undefinierte auf diesubmitSpinner.

http://jsfiddle.net/atlchris/tQdZB/1/

function submitSpinner(stopSpinner) {
    var theSubmitSpinner;

    if (stopSpinner === true) {
        theSubmitSpinner.stop();

        $('#overlay').remove();
    }
    else {
        $('body').append('<div id="overlay"><div id="spinner"></div></div>');

        theSubmitSpinner = new Spinner({
            lines: 13,
            length: 15,
            width: 5,
            radius: 20,
            color: '#ffffff',
            speed: 1,
            trail: 60,
            shadow: false
        }).spin(document.getElementById("spinner"));
    }
}

submitSpinner();

$(function() {
    $('#overlay').on('click', function() {
        alert('click');
        submitSpinner(true);
    });
});​

Antworten auf die Frage(4)

Ihre Antwort auf die Frage