JQuery .fadeIn() And .fadeOut() Callbacks Work Not As Expected After Rewriting Code To Recursive Callbacks

The rewritten code should display any amount of pictures and the old code is static. But what the new code does is to show instantly the last image of the array and for the full de

Solution 1:

The problem is that you don't pass a function in this line. You actually call this.showImages:

$("#img").fadeIn(0).delay(imageToShow.delay).fadeOut(0, this.showImages(imageArray));

You need to pass an anonymous function, which when called executes this.showImages:

var self = this;
$("#img").fadeIn(0).delay(imageToShow.delay).fadeOut(0, function() {
    self.showImages(imageArray);
});

And I think you also need to remove the line $("#img").show();.