Stop Animations in jQuery

Stopping animations or effects before they finish is done with the jQuery stop() method.

jQuery stop() sliding illustrations

Shows how to use the jQuery stop() method.

Stop() animation in jQuery (with parameters)

Shows how to use the jQuery stop() procedure.


Method stop() of jQuery

This same jQuery stop() approach is being used to terminate an animation or effect even before wraps up.

All jQuery effect functions, including sliding, fading, and custom animations, are supported by the stop() method.

Syntax:

$(selector).stop(stopAll,goToEnd);

The additional halt The entire parameter specifies whether or not the animation queue should be cleared. The default value is false, which means that only the active animation is stopped, allowing any queued animations to continue.

The additional goToEnd property defines not if the current animation should really be completed instantly. This same default value is false.

As a result, by default, the stop() method terminates the current animation on the selected element.

The stop() method is displayed in the following illustration without a parameters:

Illustration:

EXAMPLE ❯