Documentation

UI/Effects/ClassTransitions

From jQuery JavaScript Library

Jump to: navigation, search

The jQuery UI effects core extends the base class API to be able to animate between two different classes. The following methods are changed. They now accept three additional parameters: speed, easing (optional), and callback.

NameType
Class:

Attributes/switchClass

NameType
addClass( class )Returns: jQuery
Adds the specified class(es) to each of the set of matched elements.
removeClass( class )Returns: jQuery
Removes all or the specified class(es) from the set of matched elements.
toggleClass( class )Returns: jQuery
Adds the specified class if it is not present, removes the specified class if it is present.
toggleClass( class, switch )Returns: jQuery
New in jQuery 1.3 Adds the specified class if the switch is true, removes the specified class if the switch is false.

switchClass

The switchClass method allows you to visually transition from one class to another. (This functionality is often described as 'animateClass'.)

For example:

$(elem).switchClass('currentClass','newClass',500,'easeOutBounce',function(){
  console.log('transition is done!');
});