haunted85
haunted85

Reputation: 1671

How to make sure animations are executed in queue

I have to animate divs. I need to make sure that as a button is clicked the old divs fade out completely before letting the new divs fade in.

showNews: function() {
    var start = this.counter * this.displayatonce;
    var end = this.counter * this.displayatonce + (this.displayatonce - 1);

    for (i=start; i<=end; i++) {
        this.news.eq(i).fadeIn();
    }

},

hideAllNews: function() {
    this.news.fadeOut();
},

navigateNews: function() {
    this.hideAllNews();
    this.showNews();
},

how do I make this work?

Upvotes: 0

Views: 99

Answers (1)

RoToRa
RoToRa

Reputation: 38431

jQuery's animation functions take a callback function as a parameter. Start animations that you want to execute after another animation in its callback.

Example:

elememtsToHide.fadeOut(function() {
  elementsToShow.fadeIn();
});

Upvotes: 1

Related Questions