Delay in animation after multiple calls using jquery.animate

I am trying to show an overlay all over the page after clicking on a div by calling a function that implements jquery.animate on a click event which happens after a few clicks like 4 or 5 tries, I start to notice that there is a delay between clicking on the div and the displayed overlay, and this delay increases after each click

detailed code in jsfiddle and here is the javascript code

function initTemplateEditor(params) {
if (typeof params === "undefined") {
    throw new Error("can't init the editor without params!");
}

var
openEditor = function () {
    $(params.templateEditor).animate({
        opacity: 1
    }, {
        duration: 350,
        start: function () {
            $(params.templateEditor).css({
                "display": "block",
                    "width": $(window).width() - 10,
                    "height": $(window).height() - 10
            });
        }
    });
},
closeEditor = function () {
    $(params.templateEditor).animate({
        opacity: 0
    }, 350, function () {
        $(this).css("display", "none");
    });
};
$("#editorClose").click(function () {
    closeEditor();
});
openEditor();
}

$(".template-box").click(function () {
    initTemplateEditor({
        templateEditor: "#templateEditor",
        template: this
    });
});