CODEWITHSUNDEEP
javascriptjqueryscroll
user1449456
user1449456

Reputation: 642

Scroll event is firing after jquery animate function was done

Here is the example.

If you check the console you will notice that Scroll Fired is logged several times during the scroll animation and once the animation is done the callback function is called and ANIMATION DONE is logged. However, after that there is one more Scroll Fired log.

Why is this happening? How can I prevent it?

Upvotes: 1

Views: 448

Answers (1)

pitaridis
pitaridis

Reputation: 2983

A quick fix for your problem can be the following

var child = $('#container');
var onComplete = function () {
    completed = true;
    console.log('ANIMATION DONE');
};

var completed = false;
child.animate({scrollLeft: 50}, 300, onComplete);

child.scroll(function () {
  if (!completed)
    console.log('Scroll Fired');
});

I just added a variable which shows if the animation has been completed in order to stop the scroll event code.

Upvotes: 2

Related Questions