Search code examples
javascriptjquerycallbackcalljquery-callback

jQuery call incorrectly firing at the same time as fade


I am building a lightbox and am running into an issue where the following fadeIn function is firing at the same time as the fadeOut instead of afterwards.

Why is updateImage.call(this) firing at the same time as the fadeOut? Should it not fire afterwards considering it is placed as a callback?

Full code snippet

function updateImage() {
    activeImage = overlayImagesBox.find('.' + this.className);
    activeImage.fadeIn('slow').addClass('active-image');
}

imageLinks.on('click', function (e) {
    e.preventDefault();
    if (!activeImage) {
        updateImage.call(this);
    } else {
        activeImage.removeClass('active-image').fadeOut('slow', updateImage.call(this));
        activeImage = null;
    }
});

Solution

  • As @blex mentioned in the comments the correct answer is simply passing the function as a callback instead of executing it. Thank you for the help everyone.