/**
+          /**
  * Handles all the animation process
  * @module animate
  */
@@ -674,24 +671,39 @@ Source: animate.js
 };

/**
+          /**
  * Global Objects
  * @module globals
  */
@@ -179,24 +176,33 @@ Source: globals.js
 );

/**
+          /**
  * Builds the animation API that will be exported to the final user
  * @module js-css-animations
  */
@@ -389,24 +386,33 @@ Source: js-css-animations.js
 export default jsCssAnimations;

/**
+          /**
  * Handle element's width and height calculations
  * so that, when an element's visibility changes,
  * parent element's dimensions can be properly transitioned
@@ -259,24 +256,33 @@ Source: measurements.js
 export { getParentMeasures, setParentMaxMeasures, removeDimensionMax };

- - -

Handles all the animation process

- - - - - -

Source:

- animate.js, line 1 -

- - - - -

- - - - - - - - - - - - - - -

Members

- - - -

(static, constant) removeCustomCssProperties

- - - - -

Removes the CSS properties customized by the user

- - - - - - - -

Source:

- animate.js, line 154 -

- - - - - - - - -

(static, constant) setCssProperty

- - - - -

Sets an inline CSS property

- - - - - - - -

Source:

- animate.js, line 192 -

See:

module:globals.PROPERTY_NAMES

- - - - - - - - -

(inner, constant) CALLBACK_TRACKER :Object

- - - - -

Keeps track of the callbacks being executed, preventing the callbacks to be executed -multiple times if multiple elements are being animated by a single trigger.

When an element triggers an animation, no matter how many elements are being animated, -the start() and complete() callbacks should each be executed only once.

- - - -

Type:

- -Object - - -

- - - - - -

Source:

- animate.js, line 96 -

- - - - - - - - -

(inner, constant) CONFIG :Object.<string, any>

- - - - -

Object that handles configurations, either customized by the user -or default values defined in 'configurations.default' object

- - - -

Type:

- -Object.<string, any> - - -

- - - - - -

Source:

- animate.js, line 79 -

See:

configurations

- - - - - - - - -

(inner, constant) DURATION_REGEX

- - - - -

Matches duration or delay CSS properties values

- - - - - - - -

Source:

- animate.js, line 82 -

- - - - - - - - -

(inner, constant) TARGETS_STACK :Object

- - - - -

Keeps track of all the targets being animated to ensure that the callback tracker -will be removed only when all the targets have been animated. Also ensures that -all targets will be re-enabled only when all targets have already been animated.

- - - -

Type:

- -Object - - -

- - - - - -

Source:

- animate.js, line 120 -

- - - - - - - - -

(inner, constant) configHandler

- - - - -

ProxyHandler passed to the 'CONFIG' object to ensure that -if an option is not customized by the user, the default value set -in 'configurations.default' will be returned instead.

- - - - - - - -

Source:

- animate.js, line 53 -

See:

CONFIG
configurations

- - - - - - - - -

(inner, constant) configurations :Object.<string, any>

- - - - -

Contains the default value for each custom option. -Those values can be overwritten by the user by calling jsCssAnimations.config() -and passing new default values for all the animations.

- - - -

Type:

- -Object.<string, any> - - -

- - - - - -

Source:

- animate.js, line 28 -

- - - - - - - - -

(inner) trigger

- - - - -

bubbles up untill the attribute is found

- - - - - - - -

Source:

- animate.js, line 239 -

- - - - - - - - - - -

Methods

- - - - - - - -

(inner) animate(element, action, id, opts)

- - - - - - -

Handles all the animation process

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element to animate
`action`	- - -string - - - -	'show', 'hide', or 'move'
`id`	- - -number - - - -	ID of an animation in the *_ANIMS_ID objects
`opts`	- - -Object.<string, any> - - - -	All the options passed by the user

- - - - - - -

Source:

- animate.js, line 410 -

See:

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) disable(element)

- - - - - - -

Sets an attribute to indicate that the element is currently being animated -and so can not perform any other animations

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated

- - - - - - -

Source:

- animate.js, line 303 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) enable(element)

- - - - - - -

Removes the attribute that indicates that an element is currently being animated

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -

- - - - - - -

Source:

- animate.js, line 311 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) endVisibilityToggle(element, opts)

- - - - - - -

Adds the hidden or collapsed class, when necessary. -Finalize parent element's resize operations, if needed.

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated
`opts`	- - -Object - - - -	All the necessary options

- - - - - - -

Source:

- animate.js, line 367 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) eventHandler(el, animationId, opts)

- - - - - - -

Generates the handler function to be passed to the event listener

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`el`	- - -HTMLElement - - - -	The DOM element being animated
`animationId`	- - -number - - - -	The ID of the animation in the *_ANIMS_ID
`opts`	- - -Object - - - -	The options passed by the user

- - - - - - -

Source:

- animate.js, line 574 -

See:

- - - - - - - - - - - - - - - -

Returns:

- - -

A function to be passed to the addEventListener() as a handler

- - - - - - - - - - - - - - - -

(inner) getAction(element, animType)

- - - - - - -

Checks which animation CSS class is set to determine wich action to perform next

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated
`animType`	- - -* - - - -	Either 'motion' or 'visibility'

- - - - - - -

Source:

- animate.js, line 523 -

- - - - - - - - - - - - - - - -

Returns:

- - -

'show' or 'hide' or 'move' or 'moveBack'

- - - - - - - - - - - - - - - -

(inner) getTargetSelector(eventTarget)

- - - - - - -

Searches and returns the 'target-selector' attribute

If the element which triggered the event doesn't have the attribute, -will bubbles up untill the attribute is found. -If no attribute is found, an empty string is returned and so -no element will be selected to be animated

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`eventTarget`	- - -HTMLElement - - - -	The DOM element wich triggers the event

- - - - - - -

Source:

- animate.js, line 234 -

- - - - - - - - - - - - - - - -

Returns:

- - -

The CSS selector for the animation target(s) or an empty string

- - - - - - - - - - - - - - - -

(inner) getTimeInMs(value)

- - - - - - -

Removes the unit from the duration or delay and returns the value in milliseconds

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`value`	- - -string - - - -	duration or delay CSS property value

- - - - - - -

Source:

- animate.js, line 252 -

- - - - - - - - - - - - - - - -

Returns:

- - -

The duration or delay in milliseconds

- - - - - - - - - - - - - - - -

(inner) getTotalAnimTime(element)

- - - - - - -

Returns an object with the duration and delay time in milliseconds

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated

- - - - - - -

Source:

- animate.js, line 264 -

- - - - - - - - - - - - - - - -

Returns:

- - -

Both the duration and delay, in milliseconds

- - - - - - - - - - - - - - - -

(inner) handleVisibilityToggle(element, args)

- - - - - - -

Sets the parent element dimensions, if needed.

Removes the collapsed or hidden class from the element, when necessary

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated
`args`	- - -Object - - - -	All the necessary arguments

- - - - - - -

Source:

- animate.js, line 350 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) hasIterationProp(element)

- - - - - - -

Verifies if an element has defined an iteration CSS property

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -

- - - - - - -

Source:

- animate.js, line 328 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if the element has an iteration CSS property set, False otherwise

- - - - - - - - - - - - - - - -

(inner) init(trigger)

- - - - - - -

Initiates the tracker

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`trigger`	- - -string - - - -	A CSS selector representing the element which triggered the animation

- - - - - - -

Source:

- animate.js, line 102 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) init(animationId, opts)

- - - - - - -

Initiate the event listener with the animation

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`animationId`	- - -number - - - -	The ID of the animation in *_ANIMS_ID object
`opts`	- - -Object - - - -	All options passed by the user

- - - - - - -

Source:

- animate.js, line 605 -

See:

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) initCallback(trigger, fn, type)

- - - - - - -

Executes a given callback, checking, when necessary, if the callback was already -executed by another element being animated by the same trigger button

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`trigger`	- - -string - - - -	The CSS selector of the element that triggered the animation
`fn`	- - -function - - - -	The callback to execute
`type`	- - -string - - - -	Either 'start' or 'complete'

- - - - - - -

Source:

- animate.js, line 384 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) isEnabled(element)

- - - - - - -

Verifies if an element is already being animated or not

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element to check

- - - - - - -

Source:

- animate.js, line 320 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if the element is not currently being animated

- - - - - - - - - - - - - - - -

(inner) isMotion(animType)

- - - - - - -

Returns true if the animation type is 'motion'

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`animType`	- - -string - - - -	Either 'motion' or 'visibility'

- - - - - - -

Source:

- animate.js, line 285 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if animation type is 'motion'. False otherwise.

- - - - - - - - - - - - - - - -

(inner) isVisibility(animType)

- - - - - - -

Returns true if the animation type is 'visibility'

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`animType`	- - -string - - - -	Either 'motion' or 'visibility'

- - - - - - -

Source:

- animate.js, line 279 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if animation type is 'visibility'. False otherwise.

- - - - - - - - - - - - - - - -

(inner) preset(el, args)

- - - - - - -

Sets the CSS properties customized by the user, -prior to the begining of the animation

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`el`	- - -HTMLElement - - - -	The DOM element being animated
`args`	- - -Object - - - -	The animation's ID and type and all the options passed by the user

- - - - - - -

Source:

- animate.js, line 544 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) remove(trigger)

- - - - - - -

Removes 'trigger' from the tracker

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`trigger`	- - -string - - - -	A CSS selector representing the element which triggered the animation

- - - - - - -

Source:

- animate.js, line 109 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) removeMotionCssClass(element)

- - - - - - -

Removes the current motion animation CSS class from the element

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Module: animate

+ +

Handles all the animation process

+ +

Source:

+ animate.js, + line 1 +

+ +

Members

+ +

+ (static, constant) removeCustomCssProperties +

+ +

Removes the CSS properties customized by the user

+ +

Source:

+ animate.js, + line 154 +

+ +

+ (static, constant) setCssProperty +

+ +

Sets an inline CSS property

+ +

Source:

+ animate.js, + line 192 +

See:

+ module:globals.PROPERTY_NAMES +

+ +

+ (inner, constant) CALLBACK_TRACKER :Object +

+ +

+ Keeps track of the callbacks being executed, preventing the + callbacks to be executed multiple times if multiple elements are + being animated by a single trigger. +

+ When an element triggers an animation, no matter how many elements + are being animated, the start() and complete() callbacks should + each be executed only once. +

+ +

Type:

+ Object +

+ +

Source:

+ animate.js, + line 96 +

+ +

+ (inner, constant) CONFIG + :Object.<string, any> +

+ +

+ Object that handles configurations, either customized by the user + or default values defined in 'configurations.default' object +

+ +

Type:

+ Object.<string, any> +

+ +

Source:

+ animate.js, + line 79 +

See:

configurations

+ +

+ (inner, constant) DURATION_REGEX +

+ +

Matches duration or delay CSS properties values

+ +

Source:

+ animate.js, + line 82 +

+ +

+ (inner, constant) TARGETS_STACK :Object +

+ +

+ Keeps track of all the targets being animated to ensure that the + callback tracker will be removed only when all the targets have + been animated. Also ensures that all targets will be re-enabled + only when all targets have already been animated. +

+ +

Type:

+ Object +

+ +

Source:

+ animate.js, + line 120 +

+ +

+ (inner, constant) configHandler +

+ +

+ ProxyHandler passed to the 'CONFIG' object to ensure that if an + option is not customized by the user, the default value set in + 'configurations.default' will be returned instead. +

+ +

Source:

+ animate.js, + line 53 +

See:

CONFIG
configurations

+ +

+ (inner, constant) configurations + :Object.<string, any> +

+ +

+ Contains the default value for each custom option. Those values + can be overwritten by the user by calling jsCssAnimations.config() + and passing new default values for all the animations. +

+ +

Type:

+ Object.<string, any> +

+ +

Source:

+ animate.js, + line 28 +

+ +

+ (inner) trigger +

+ +

bubbles up untill the attribute is found

+ +

Source:

+ animate.js, + line 239 +

+ +

Methods

+ +

+ (inner) animate(element, action, id, opts) +

+ +

Handles all the animation process

+ +

Parameters:

+ +

Name	Type	Description

+ + + + + + + + + + + + - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement - - - -	The DOM element being animated

- - - - - - -

Source:

- animate.js, line 291 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) resetDefaultConfig()

- - - - - - -

Reset the configurations to its default values -by removing from 'CONFIG' all options customized by the user

- - - - - - - - - - - - - -

Source:

- animate.js, line 179 -

See:

CONFIG

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) updateCssProperties(element, opts)

- - - + + HTMLElement + + +

The DOM element to animate

+ + -

Sets the CSS properties customized by the user in the animation function's options

- - - - - - - - - -

Parameters:

- + + action - - - - - - + - + + - + + - + - - - + + - - + + - - + + + + + +

Name	+ string +	Type	+ 'show', 'hide', or 'move' +
`id`	+ number +	Description
+ ID of an animation in the *_ANIMS_ID objects +
`opts`
+ Object.<string, any> +	+ All the options passed by the user +

+ +

Source:

+ animate.js, + line 410 +

See:

+ module:globals.VISIBILITY_ANIMS_ID +
+ module:globals.MOTION_ANIMS_ID +

+ +

+ (inner) disable(element) +

+ +

+ Sets an attribute to indicate that the element is currently being + animated and so can not perform any other animations +

+ +

Parameters:

+ + + + + + + + + + + + + + - - - - + + + + + +

Name	Type	Description
`element`	- - -HTMLElement - - - -	+ HTMLElement +	+ The DOM element being animated +

+ +

Source:

+ animate.js, + line 303 +

+ +

+ (inner) enable(element) +

+ +

+ Removes the attribute that indicates that an element is currently + being animated +

+ +

Parameters:

+ + + + + + + + + + + + + + + - + + + + + +

Name	Type	Description
`element`	+ HTMLElement +

+ +

Source:

+ animate.js, + line 311 +

+ +

+ (inner) endVisibilityToggle(element, opts) +

+ +

+ Adds the hidden or collapsed class, when necessary. Finalize + parent element's resize operations, if needed. +

+ +

Parameters:

+ + + + + + + + + + + + + + + - - + - + + - - + - - - - - - - - - - - - - -

Name	Type	Description
`element`	The DOM element to update the CSS Properties
+ HTMLElement +	+ The DOM element being animated +
`opts`	- - -Object.<string, string> - - - -	Object containing a custom property key and a CSS value to be updated

- - - - - - -

Source:

- animate.js, line 201 -

- - - - - - - - - - - - - - - - - - + + Object + + + +

All the necessary options

+ + + + + +

Source:

+ animate.js, + line 367 +

+ +

+ (inner) eventHandler(el, animationId, opts) +

+ +

+ Generates the handler function to be passed to the event listener +

+ +

Parameters:

+ + + + + + + + + + + + + + + - - - - - - -

(inner) updateDefaultConfig(opts)

- - - - - - -

Customize the default animations configurations by overwriting -the 'CONFIG' values

- - - - - - - - - -

Parameters:

- - -

Name	Type	Description
`el`

- - - - - - - + - + + - + + - - - + - - + + - - + - - - - - - - - - - - - - -

Name	Type	+ HTMLElement +	+ The DOM element being animated +
`animationId`	Description
+ number +
+ The ID of the animation in the *_ANIMS_ID +
`opts`	- - -Object - - - -	All the options customized by the user

- - - - - - -

Object

The options passed by the user

Source:

+ animate.js, + line 574 +

See:

+ module:globals.VISIBILITY_ANIMS_ID +
+ module:globals.MOTION_ANIMS_ID +

Returns:

+ A function to be passed to the addEventListener() as a handler +

+ (inner) getAction(element, animType) +

+ Checks which animation CSS class is set to determine wich action + to perform next +

Parameters:

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element being animated +
`animType`	+ * +	+ Either 'motion' or 'visibility' +

Source:

+ animate.js, + line 523 +

Returns:

'show' or 'hide' or 'move' or 'moveBack'

+ (inner) getTargetSelector(eventTarget) +

Searches and returns the 'target-selector' attribute

+ If the element which triggered the event doesn't have the + attribute, will bubbles up untill the attribute is found. If no + attribute is found, an empty string is returned and so no element + will be selected to be animated +

Parameters:

Source:

- animate.js, line 166 -

Name	Type	Description
`eventTarget`	+ HTMLElement +	+ The DOM element wich triggers the event +

Source:

+ animate.js, + line 234 +

Returns:

+ The CSS selector for the animation target(s) or an empty string +

+ (inner) getTimeInMs(value) +

+ Removes the unit from the duration or delay and returns the value + in milliseconds +

Parameters:

Name	Type	Description
`value`	+ string +	+ duration or delay CSS property value +

Source:

+ animate.js, + line 252 +

Returns:

The duration or delay in milliseconds

+ (inner) getTotalAnimTime(element) +

+ Returns an object with the duration and delay time in milliseconds +

Parameters:

See:

CONFIG

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element being animated +

Source:

+ animate.js, + line 264 +

Returns:

Both the duration and delay, in milliseconds

+ (inner) handleVisibilityToggle(element, args) +

Sets the parent element dimensions, if needed.

+ Removes the collapsed or hidden class from the element, when + necessary +

Parameters:

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element being animated +
`args`	+ Object +	+ All the necessary arguments +

Source:

+ animate.js, + line 350 +

+ (inner) hasIterationProp(element) +

Verifies if an element has defined an iteration CSS property

Parameters:

Name	Type	Description
`element`	+ HTMLElement +

Source:

+ animate.js, + line 328 +

Returns:

+ True if the element has an iteration CSS property set, False + otherwise +

+ (inner) init(trigger) +

Initiates the tracker

Parameters:

Name	Type	Description
`trigger`	+ string +	+ + A CSS selector representing the element which triggered the + animation + +

Source:

+ animate.js, + line 102 +

+ (inner) init(animationId, opts) +

Initiate the event listener with the animation

Parameters:

Name	Type	Description
`animationId`	+ number +	+ The ID of the animation in *_ANIMS_ID object +
`opts`	+ Object +	+ All options passed by the user +

Source:

+ animate.js, + line 605 +

See:

+ module:globals.VISIBILITY_ANIMS_ID +
+ module:globals.MOTION_ANIMS_ID +

+ (inner) initCallback(trigger, fn, type) +

+ Executes a given callback, checking, when necessary, if the + callback was already executed by another element being animated by + the same trigger button +

Parameters:

Name	Type	Description
`trigger`	+ string +	+ + The CSS selector of the element that triggered the animation + +
`fn`	+ function +	The callback to execute
`type`	+ string +	+ Either 'start' or 'complete' +

Source:

+ animate.js, + line 384 +

+ (inner) isEnabled(element) +

Verifies if an element is already being animated or not

Parameters:

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element to check +

Source:

+ animate.js, + line 320 +

Returns:

True if the element is not currently being animated

+ (inner) isMotion(animType) +

Returns true if the animation type is 'motion'

Parameters:

Name	Type	Description
`animType`	+ string +	+ Either 'motion' or 'visibility' +

Source:

+ animate.js, + line 285 +

Returns:

True if animation type is 'motion'. False otherwise.

+ (inner) isVisibility(animType) +

Returns true if the animation type is 'visibility'

Parameters:

Name	Type	Description
`animType`	+ string +	+ Either 'motion' or 'visibility' +

Source:

+ animate.js, + line 279 +

Returns:

True if animation type is 'visibility'. False otherwise.

+ (inner) preset(el, args) +

+ Sets the CSS properties customized by the user, prior to the + begining of the animation +

Parameters:

Name	Type	Description
`el`	+ HTMLElement +	+ The DOM element being animated +
`args`	+ Object +	+ + The animation's ID and type and all the options passed by + the user + +

Source:

+ animate.js, + line 544 +

+ (inner) remove(trigger) +

Removes 'trigger' from the tracker

Parameters:

Name	Type	Description
`trigger`	+ string +	+ + A CSS selector representing the element which triggered the + animation + +

Source:

+ animate.js, + line 109 +

+ (inner) removeMotionCssClass(element) +

+ Removes the current motion animation CSS class from the element +

Parameters:

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element being animated +

Source:

+ animate.js, + line 291 +

+ (inner) resetDefaultConfig() +

+ Reset the configurations to its default values by removing from + 'CONFIG' all options customized by the user +

Source:

+ animate.js, + line 179 +

See:

CONFIG

+ (inner) updateCssProperties(element, opts) +

+ Sets the CSS properties customized by the user in the animation + function's options +

Parameters:

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element to update the CSS Properties +
`opts`	+ Object.<string, string> +	+ + Object containing a custom property key and a CSS value to + be updated + +

Source:

+ animate.js, + line 201 +

+ (inner) updateDefaultConfig(opts) +

+ Customize the default animations configurations by overwriting the + 'CONFIG' values +

Parameters:

Name	Type	Description
`opts`	+ Object +	+ All the options customized by the user +

Source:

+ animate.js, + line 166 +

See:

CONFIG

- - + + + + + +

Module: globals

+ +

Global Objects

- - - - - -

Source:

- globals.js, line 1 -

- - - +

Source:

+ globals.js, + line 1 +

+ +

Members

+ +

+ (static, constant) CLASS_NAMES :Object +

+ +

CSS Class Names

+ +

Type:

+ Object +

+ +

Source:

+ globals.js, + line 88 +

+ +

+ (static, constant) CUSTOM_CSS_PROPERTIES + :ReadonlyArray.<string> +

+ +

+ CSS Properties customized by options passed in the animation + function +

+ ('cursor' can only be customized in animations triggered by click + event so it is not being included here) +

+ +

Type:

+ ReadonlyArray.<string> +

+ +

Source:

+ globals.js, + line 149 +

+ +

+ (static, constant) MOTION_ANIMS_ID + :Object.<string, number> +

+ +

Motion Animations IDs

+ The key is the name of the animation function and the value is the + index of the CSS class name inside CLASS_NAMES.move and + CLASS_NAMES.moveBack +

+ +

Type:

+ Object.<string, number> +

+ +

Source:

+ globals.js, + line 33 +

See:

+ module:globals.CLASS_NAMES +

+ +

+ (static, constant) PROPERTY_NAMES + :Object.<string, string> +

+ +

CSS Custom Properties

+ The key is the name of the option passed to the animation function + and the value is the respective CSS variable +

+ +

Type:

+ Object.<string, string> +

+ +

Source:

+ globals.js, + line 54 +

+ +

+ (static, constant) VISIBILITY_ANIMS_ID + :Object.<string, number> +

+ +

Visibility Animations IDs

+ The key is the name of the animation function and the value is the + index of the CSS class name inside CLASS_NAMES.hide and + CLASS_NAMES.show +

+ +

Type:

+ Object.<string, number> +

+ +

Source:

+ globals.js, + line 15 +

See:

+ module:globals.CLASS_NAMES +

- - - - - - - - - - - - - -

Members

- - - -

(static, constant) CLASS_NAMES :Object

- - - - -

CSS Class Names

- - - -

Type:

- -Object - - -

- - - - - -

Source:

- globals.js, line 88 -

- - - - - - - - -

(static, constant) CUSTOM_CSS_PROPERTIES :ReadonlyArray.<string>

- - - - -

CSS Properties customized by options passed in the animation function

('cursor' can only be customized in animations triggered by click event -so it is not being included here)

- - - -

Type:

- -ReadonlyArray.<string> - - -

- - - - - -

Source:

- globals.js, line 149 -

- - - - - - - - -

(static, constant) MOTION_ANIMS_ID :Object.<string, number>

- - - - -

Motion Animations IDs

The key is the name of the animation function -and the value is the index of the CSS class name -inside CLASS_NAMES.move and CLASS_NAMES.moveBack

- - - -

Type:

- -Object.<string, number> - - -

- - - - - -

Source:

- globals.js, line 33 -

See:

module:globals.CLASS_NAMES

- - - - - - - - -

(static, constant) PROPERTY_NAMES :Object.<string, string>

- - - - -

CSS Custom Properties

The key is the name of the option passed to the animation function -and the value is the respective CSS variable

- - - -

Type:

- -Object.<string, string> - - -

- - - - - -

Source:

- globals.js, line 54 -

- - - - - - - - -

(static, constant) VISIBILITY_ANIMS_ID :Object.<string, number>

- - - - -

Visibility Animations IDs

The key is the name of the animation function -and the value is the index of the CSS class name -inside CLASS_NAMES.hide and CLASS_NAMES.show

- - - -

Type:

- -Object.<string, number> - - -

- - - - - -

Source:

- globals.js, line 15 -

See:

module:globals.CLASS_NAMES

- - - - - - - - - - - - - - -

- - -

Builds the animation API that will be exported to the final user

- - - - - -

Source:

- js-css-animations.js, line 1 -

- - - - -

- - - - - - - - - - - - - - -

Members

- - - -

(inner, constant) animationFunctions :Object

- - - - -

An object containing all the animations functions.

Visibility animations functions are under -animationFunctions.hide and animationFunctions.show

All other keys of animationFunctions are Motion animations functions

- - - -

Type:

- -Object - - -

- - - - - -

Source:

- js-css-animations.js, line 170 -

See:

- - - - - - - - -

(inner, constant) eventBoundAnimations :Object.<string, function()>

- - - - -

An object containing animations functions wich are triggered by an event (like 'click')

- - - -

Type:

- -Object.<string, function()> - - -

- - - - - -

Source:

- js-css-animations.js, line 237 -

- - - - - - - - -

(inner, constant) jsCssAnimations :Object.<string, (function()|Object)>

- - - - -

An API encapsulating all the functions that can be used by the user, -like all the animations functions and auxiliary functions like: -isTransformed(), isVisible() and isHidden()

- - - -

Type:

- -Object.<string, (function()|Object)> - - -

- - - - - -

Source:

- js-css-animations.js, line 312 -

- - - - - - - - -

(inner, constant) verifyAnimationName :ProxyHandler

- - - - -

Will throw an ReferenceError if the animation name does not corresponds to any animation function

- - - -

Type:

- -ProxyHandler - - -

- - - - - -

Source:

- js-css-animations.js, line 294 -

- - - - - - - - - - -

Methods

- - - - - - - -

(inner) checkVisibility(selector, mode) → {boolean}

- - - - - - -

Verifies if a given element is hidden or visible

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -Element -\| - -string - - - -	An element or a valid CSS selector corresponding to the element
`mode`	- - -string - - - -	Either 'visible' or 'hidden'

- - - - - - -

Source:

- js-css-animations.js, line 277 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True or False depending if the element is visible or hidden, according to the 'mode' passed

- - - -

- Type -: - -boolean - - -

- - - - - - - - - - - - - -

(inner) config(opts)

- - - - - - -

Default values used by all animations are set by the user by -overriding default animations properties and options

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`opts`	- - -Object - - - -	All custom animation properties and options.

- - - - - - -

Source:

- js-css-animations.js, line 71 -

See:

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) getTargets(selector)

- - - - - - -

Gets the element(s) to be animated. The user can pass either an HTMLElement or a CSS selector as a target to the animation

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -HTMLElement -\| - -string - - - -	An HTMLElement or a valid CSS selector to be passed to querySelectorAll()

- - - - - - -

Source:

- js-css-animations.js, line 58 -

- - - - - - - - - - - - - - - -

Returns:

- - -

An array containing a single HTMLElement or a NodeList with all the elements matching the CSS selector in 'selector'

- - - - - - - - - - - - - - - -

(inner) isHidden(selector)

- - - - - - - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -Element -\| - -string - - - -	Dom element or a valid CSS selector

- - - - - - -

Source:

- js-css-animations.js, line 355 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if the element is hidden, False otherwise

- - - - - - - - - - - - - - - -

(inner) isTransformed(selector)

- - - - - - -

Verifies if an element is out of its original orientation or scale.

Note that if the element has CSS property 'transform: rotate(0deg)', -isTransformed() will still return False, as the element is not -out of its original orientation.

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -HTMLElement -\| - -string - - - -	An element or a valid CSS selector corresponding to the element

- - - - - - -

Source:

- js-css-animations.js, line 265 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if the element was rotated from its original orientation. False if it maintains the original orientation.

- - - - - - - - - - - - - - - -

(inner) isVisible(selector)

- - - - - - - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -Element -\| - -string - - - -	Dom element or a valid CSS selector

- - - - - - -

Source:

- js-css-animations.js, line 350 -

- - - - - - - - - - - - - - - -

Returns:

- - -

True if the element is visible, False otherwise

- - - - - - - - - - - - - - - -

(inner) reset()

- - - - - - -

Resets default animations values by -removing default values customized by the user

- - - - - - - - - - - - - -

Source:

- js-css-animations.js, line 82 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) selectAllElements(selector)

- - - - - - -

Returns a NodeList with all elements that match 'selector'

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Module: js-css-animations

+ +

+ Builds the animation API that will be exported to the final user +

+ +

Source:

+ js-css-animations.js, line 1 +

+ +

Members

+ +

+ (inner, constant) animationFunctions :Object +

+ +

An object containing all the animations functions.

+ Visibility animations functions are under animationFunctions.hide + and animationFunctions.show +

+ All other keys of animationFunctions are Motion animations + functions +

+ +

Type:

+ Object +

+ +

Source:

+ js-css-animations.js, + line 170 +

See:

+ module:globals.VISIBILITY_ANIMS_ID +
+ module:globals.MOTION_ANIMS_ID +

+ +

+ (inner, constant) eventBoundAnimations + :Object.<string, function()> +

+ +

+ An object containing animations functions wich are triggered by an + event (like 'click') +

+ +

Type:

+ Object.<string, function()> +

+ +

Source:

+ js-css-animations.js, + line 237 +

+ +

+ (inner, constant) jsCssAnimations + :Object.<string, (function()|Object)> +

+ +

+ An API encapsulating all the functions that can be used by the + user, like all the animations functions and auxiliary functions + like: isTransformed(), isVisible() and isHidden() +

+ +

Type:

+ Object.<string, (function()|Object)> +

+ +

Source:

+ js-css-animations.js, + line 312 +

+ +

+ (inner, constant) verifyAnimationName + :ProxyHandler +

+ +

+ Will throw an ReferenceError if the animation name does not + corresponds to any animation function +

+ +

Type:

+ ProxyHandler +

+ +

Source:

+ js-css-animations.js, + line 294 +

+ +

Methods

+ +

+ (inner) checkVisibility(selector, mode) → {boolean} +

+ +

Verifies if a given element is hidden or visible

+ +

Parameters:

+ +

Name	Type	Description

+ + + + + + + + + + + + - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -string - - - -	A valid CSS selector to be passed to querySelectorAll()

- - - - - - -

Source:

- js-css-animations.js, line 44 -

+ + Element + | + string + + +

+ An element or a valid CSS selector corresponding to the + element +

+ + + + mode + + string + + + +

Either 'visible' or 'hidden'

+ + + + + +

Source:

+ js-css-animations.js, + line 277 +

+ +

Returns:

+ +

+ True or False depending if the element is visible or hidden, + according to the 'mode' passed +

+ +

Type: + boolean +

+ +

+ (inner) config(opts) +

+ +

+ Default values used by all animations are set by the user by + overriding default animations properties and options +

+ +

Parameters:

+ + + + + + + + + + + + + + + - - - - - - - - - -

Returns:

- - -

A NodeList containing all elements matched by the 'selector'

- - - - - - - - - - - - - - - -

(inner) selectElement(selector)

- - - - - - -

If 'selector' is a string containing a valid CSS selector, -it will be used to perform a querySelector(), -If 'selector' is already an HTMLElement it will be returned as it is.

- - - - - - - - - -

Parameters:

- - -

Name	Type	Description
`opts`

- - - - - - - - - - - - - - - - - - - - - + + + + + +

Name	Type	Description
+ Object +	+ All custom animation properties and options. +

+ +

Source:

+ js-css-animations.js, + line 71 +

See:

+ module:globals.PROPERTY_NAMES +
+ module:animate~configurations +

+ +

+ (inner) getTargets(selector) +

+ +

+ Gets the element(s) to be animated. The user can pass either an + HTMLElement or a CSS selector as a target to the animation +

+ +

Parameters:

+ + + + + + + + + + + + + + - - - - - - - - - - - - - -

Name	Type	Description
`selector`	- - -Element -\| - -string - - - -	If it's an HTMLElement, 'selector' will be returned as it is. If it's a string, it should be a valid CSS selector

- - - - - - -

Source:

- js-css-animations.js, line 25 -

- - - - - - - - - - - - - - - -

Returns:

- - -

An HTMLElement

- - - - - - - - - - - - - - - -

(inner) toggle(selector, animA, animB, opts)

- - - - - - -

Toggles between two animations.

If 'animA' and 'animB' have the same name, -it will toggle between the 'hide' state and the 'show' state, -although this is only applicable to visibility animations.

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Name	Type	Description
+ HTMLElement + \| + + string +	+ + An HTMLElement or a valid CSS selector to be passed to + querySelectorAll() + +

+ +

Source:

+ js-css-animations.js, + line 58 +

+ +

Returns:

+ +

+ An array containing a single HTMLElement or a NodeList with all + the elements matching the CSS selector in 'selector' +

+ +

+ (inner) isHidden(selector) +

+ +

Parameters:

+ + + + + + + + + + + + + + - - + + + + +

Name	Type	Description
`selector`	- - -HTMLElement -\| +	+ Element + \| + + string +	+ Dom element or a valid CSS selector +

+ +

Source:

+ js-css-animations.js, + line 355 +

+ +

Returns:

+ +

True if the element is hidden, False otherwise

+ +

+ (inner) isTransformed(selector) +

+ +

+ Verifies if an element is out of its original orientation or + scale. +

+ Note that if the element has CSS property 'transform: + rotate(0deg)', isTransformed() will still return False, as the + element is not out of its original orientation. +

+ +

Parameters:

+ + + + + + + + + + + + + + + -string + + + + + +

Name	Type	Description
`selector`	+ HTMLElement + \| + + string +	+ + An element or a valid CSS selector corresponding to the + element + +

+ +

Source:

+ js-css-animations.js, + line 265 +

+ +

Returns:

+ +

+ True if the element was rotated from its original orientation. + False if it maintains the original orientation. +

+ +

+ (inner) isVisible(selector) +

+ +

Parameters:

+ + + + + + + + + + + + + + + + + + + + +

Name	Type	Description
`selector`	+ Element + \| + + string +	+ Dom element or a valid CSS selector +

+ +

Source:

+ js-css-animations.js, + line 350 +

+ +

Returns:

+ +

True if the element is visible, False otherwise

+ +

+ (inner) reset() +

+ +

+ Resets default animations values by removing default values + customized by the user +

+ +

Source:

+ js-css-animations.js, + line 82 +

+ +

+ (inner) selectAllElements(selector) +

+ +

Returns a NodeList with all elements that match 'selector'

+ +

Parameters:

+ + + + + + + + + + + + + + + - - + + + + + +

Name	Type	Description
`selector`	+ string +	+ A valid CSS selector to be passed to querySelectorAll() +

+ +

Source:

+ js-css-animations.js, + line 44 +

+ +

Returns:

+ +

A NodeList containing all elements matched by the 'selector'

+ +

+ (inner) selectElement(selector) +

+ +

+ If 'selector' is a string containing a valid CSS selector, it will + be used to perform a querySelector(), If 'selector' is already an + HTMLElement it will be returned as it is. +

+ +

Parameters:

+ + + + + + + + + + + + + + + - + + + + + +

Name	Type	Description
`selector`	+ Element + \| + + string +	+ + If it's an HTMLElement, 'selector' will be returned as it + is. If it's a string, it should be a valid CSS selector + +

+ +

Source:

+ js-css-animations.js, + line 25 +

+ +

Returns:

+ +

An HTMLElement

+ +

+ (inner) toggle(selector, animA, animB, opts) +

+ +

Toggles between two animations.

+ If 'animA' and 'animB' have the same name, it will toggle between + the 'hide' state and the 'show' state, although this is only + applicable to visibility animations. +

+ +

Parameters:

+ + + + + + + + + + + + + + + - + - + string + - + + - - + - - - + - + + - - - - - - - - - + - - - - - + + - - - - - - - - - - - + - - - - - - - - - - - - - -

Name	Type	Description
`selector`	+ HTMLElement + \| -	The DOM element or a valid CSS selector with the element(s) to be animated
+ + The DOM element or a valid CSS selector with the element(s) + to be animated + +
`animA`	- - -string - - -	+ string +	+ The initial animation name +
The initial animation name
`animB`	- - -string +	+ string +	The next animation name
The next animation name
`opts`	- - -Object -\| - -Object - - - -	All options that can be passed by the user to customize the animation

- - - - - - -

Source:

- js-css-animations.js, line 112 -

See:

module:globals.VISIBILITY_ANIMS_ID

- - - - - - - - - - - - - - - - - - - - - - - - - - -

- - -

Handles parent element's resizing to perform width/height smooth transitions -when child element is being animated

- - - - - -

Source:

- resize-parent.js, line 1 -

- - - - -

- - - - - - - - - - - - - - - - -

Methods

- - - - - - - -

(inner) endParentResize(element, opts)

- - - - - - -

Removes all CSS properties and classes added to the parent element to handle the dimensions transitions during the animation

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Module: resize-parent

+ +

+ Handles parent element's resizing to perform width/height smooth + transitions when child element is being animated +

+ +

Source:

+ resize-parent.js, + line 1 +

+ +

Methods

+ +

+ (inner) endParentResize(element, opts) +

+ +

+ Removes all CSS properties and classes added to the parent element + to handle the dimensions transitions during the animation +

+ +

Parameters:

+ +

Name	Type	Description

+ + + + + + + + + + + + - - - - - + + - - - - - - - - - - - + - - - - - - - - - - - - - -

Name	Type	Description
`element`	- - -HTMLElement +	+ HTMLElement +	+ The DOM element being animated +
The DOM element being animated
`opts`	- - -Object - - - -	Indicates which dimensions were transitioned

- - - - - - -

Source:

- resize-parent.js, line 120 -

- - - - - - - - - - - - - - - - - - - - - - - - - - -

(inner) getDimension(wTransit, hTransit)

- - - - - - -

Returns a string with the dimension to transition, or 'all' for both dimensions, or undefined if neither width nor height should be transitioned

- - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Name	Type	Description
+ Object +	+ Indicates which dimensions were transitioned +

+ +

Source:

+ resize-parent.js, + line 120 +

+ +

+ (inner) getDimension(wTransit, hTransit) +

+ +

+ Returns a string with the dimension to transition, or 'all' for + both dimensions, or undefined if neither width nor height should + be transitioned +

+ +

Parameters:

+ + + + + + + + + + + + + + - - - + - + + - - - - - - - - - + - - - - - - - - - - - - - -

Name	Type	Description
`wTransit`	- - -boolean - - -	+ boolean +	+ + Indicates if parent element should have width transition + +
Indicates if parent element should have width transition
`hTransit`	- - -boolean - - - -	Indicates if parent element should have height transition

- - - - - - -

Source:

- resize-parent.js, line 61 -

- - - - - - - - - - - - - - - -

Returns:

- - -

undefined if both parameters are false, 'all' if both are true and 'width' or 'height' if only wTransit or hTransit is true, respectively

- - - - - - - - - - - - - - -

(inner) getRootCssProperty(property)

- - - - - - -

Gets the default value of a CSS property defined in js-css-animations.css

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Name	Type	Description
+ boolean +	+ + Indicates if parent element should have height transition + +

+ +

Source:

+ resize-parent.js, + line 61 +

+ +

Returns:

+ +

+ undefined if both parameters are false, 'all' if both are true and + 'width' or 'height' if only wTransit or hTransit is true, + respectively +

+ +

+ (inner) getRootCssProperty(property) +

+ +

+ Gets the default value of a CSS property defined in + js-css-animations.css +

+ +

Parameters:

+ + + + + + + + + + + + + + - - - - - - - - - - - - - -

Name	Type	Description
`property`	- - -string - - - -	PROPERTY_NAMES key corresponding to a CSS property name

- - - - - - -

Source:

- resize-parent.js, line 30 -

- - - - - - + + string + + + +

PROPERTY_NAMES key corresponding to a CSS property name

+ + + + + +

Source:

+ resize-parent.js, + line 30 +

+ +

Returns:

+ +

The default js-css-animation property value

+ +

+ (inner) initParentResize(args) +

+ +

+ Handles parent element width/height transitions during child + element's animation +

+ +

Parameters:

+ + + + + + + + + + + + + + + + + + + + +

Name	Type	Description
`args`	+ Object +	+ + Containing all the information needed to initiate parent's + dimensions transitions + +

+ +

Source:

+ resize-parent.js, + line 96 +

+ +

Returns:

+ +

+ An object with the dimension(s) to transition and the parent + element's measurements before and after the child element's + animation is performed +

+ +

+ (inner) removeOverflowHidden(el) +

+ +

+ Removes the CSS class which sets the overflow property to 'clip' + (or 'hidden') +

+ +

Parameters:

+ + + + + + + + + + + + + + + + + + + + +

Name	Type	Description
`el`	+ HTMLElement +	+ The DOM element with the CSS class to remove +

+ +

Source:

+ resize-parent.js, + line 81 +

+ +

+ (inner) setOverflowHidden(el) +

+ +

+ Adds a CSS class which will set the overflow property to 'clip' + (or 'hidden') +

+ +

Parameters:

+ + + + + + + + + + + + + + + + + + + + +

Name	Type	Description
`el`	+ HTMLElement +	+ The DOM element which will receive the CSS class +

+ +

Source:

+ resize-parent.js, + line 73 +

+ +

+ (inner) setParentCssProperties(element) +

+ +

+ Sets the same CSS variables (customized by the options in the + animation function) in the parent element, so the parent's + dimensions transitions will have the same custom properties of the + child element's animations +

+ +

Parameters:

+ + + + + + + + + + + + + + + + + + + + +

Name	Type	Description
`element`	+ HTMLElement +	+ The DOM element being animated +

+ +

Source:

+ resize-parent.js, + line 42 +

- - -

Handle user defined transitions to not conflict with js-css-animations transitions

- - - - - -

Source:

- transitions.js, line 1 -

- - - - -

- - - - - - - - - - - - - - -

Members

- - - -

(static, constant) appendTransition

- - - - -

If an element already has any transition defined, other than that in className, -the current transition(s) will be appended to the className transition so that -no transition will be overwritten

- - - - - - - -

Source:

- transitions.js, line 111 -

- - - - - - - - -

(static, constant) getClassTransition

- - - - -

Gets the transition in a given CSS class

- - - - - - - -

Source:

- transitions.js, line 88 -

- - - - - - - - -

(static, constant) getCurrentTransition

- - - - -

Gets user defined transitions of an element, if any

- - - - - - - -

Source:

- transitions.js, line 73 -

- - - - - - - - -

(static, constant) removeDimensionsTransitions

- - - - -

Removes the CSS class added by setDimensionsTransitions(), if any

- - - - - - - -

Source:

- transitions.js, line 183 -

See:

module:transitions.setDimensionsTransitions

- - - - - - - - -

(static, constant) removeInlineTransition

- - - - -

If element has an inline css transition appended by appendTransition() -the inline transition property will be removed to reset the element back -to its previous state

- - - - - - - -

Source:

- transitions.js, line 169 -

See:

module:transitions.appendTransition

- - - - - - - - -

(static, constant) setDimensionsTransitions

- - - - -

Appends the appropriate CSS class to handle dimension transitions. -If wTransit and hTransit are both set to false, no class will be appended.

- - - - - - - -

Source:

- transitions.js, line 152 -

- - - - - - - - - - -

Methods

- - - - - - - -

(inner) getAllTransitions(cssProperties) → {string}

- - - - - - -

Parses all CSS properties and combine all transitions into one valid shorthand value -for 'transition' CSS property

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Module: transitions

+ +

+ Handle user defined transitions to not conflict with + js-css-animations transitions +

+ +

Source:

+ transitions.js, + line 1 +

+ +

Members

+ +

+ (static, constant) appendTransition +

+ +

+ If an element already has any transition defined, other than that + in className, the current transition(s) will be appended to the + className transition so that no transition will be overwritten +

+ +

Source:

+ transitions.js, + line 111 +

+ +

+ (static, constant) getClassTransition +

+ +

Gets the transition in a given CSS class

+ +

Source:

+ transitions.js, + line 88 +

+ +

+ (static, constant) getCurrentTransition +

+ +

Gets user defined transitions of an element, if any

+ +

Source:

+ transitions.js, + line 73 +

+ +

+ (static, constant) removeDimensionsTransitions +

+ +

+ Removes the CSS class added by setDimensionsTransitions(), if any +

+ +

Source:

+ transitions.js, + line 183 +

See:

+ module:transitions.setDimensionsTransitions +

+ +

+ (static, constant) removeInlineTransition +

+ +

+ If element has an inline css transition appended by + appendTransition() the inline transition property will be removed + to reset the element back to its previous state +

+ +

Source:

+ transitions.js, + line 169 +

See:

+ module:transitions.appendTransition +

+ +

+ (static, constant) setDimensionsTransitions +

+ +

+ Appends the appropriate CSS class to handle dimension transitions. + If wTransit and hTransit are both set to false, no class will be + appended. +

+ +

Source:

+ transitions.js, + line 152 +

+ +

Methods

+ +

+ (inner) getAllTransitions(cssProperties) → {string} +

+ +

+ Parses all CSS properties and combine all transitions into one + valid shorthand value for 'transition' CSS property +

+ +

Parameters:

+ +

Name	Type	Description

+ + + + + + + + + + + + - - - - - - - - - - - - - -

Name	Type	Description
`cssProperties`	- - -CSSStyleDeclaration - - - -	A collection of CSS rules

- - - - - - -

Source:

- transitions.js, line 13 -

- - - - - - - - - - - - - - - -

Returns:

- - -

All transitions combined into a single shorthand property

- - -

- Type -: - -string - - -

- - - - - - - - - - - - - -

(inner) getTransitionClassName(wTransit, hTransit) → {string|undefined}

- - - - - - -

Verifies wether there should be widht or height transition, or both, or none

- - - - - - - - - -

Parameters:

- - - - - - - - - - - - - - - - - - - - - - - - + + + + + +

Name	Type	Description
+ CSSStyleDeclaration +	+ A collection of CSS rules +

+ +

Source:

+ transitions.js, + line 13 +

+ +

Returns:

+ +

All transitions combined into a single shorthand property

+ +

Type: + string +

+ +

+ (inner) getTransitionClassName(wTransit, hTransit) → {string|undefined} +

+ +

+ Verifies wether there should be widht or height transition, or + both, or none +

+ +

Parameters:

+ + + + + + + + + + + + + + - - - - + - + + - - - - - - - + - - - - - - - - - - - - - -

Name	Type	Description
`wTransit`	- - -boolean - - - -	+ boolean +	+ Indicates if it should have width transition +
Indicates if it should have width transition
`hTransit`	- - -boolean - - - -	Indicates if it should have height transition

- - - - - - -

Source:

- transitions.js, line 133 -

- - - - - - - - - - - - - - - -

Returns:

- - -

The name of the class with the respective transition, or undefined if there should be no transitions

- - - -

- Type -: - -string -| - -undefined - - -

- - - - - - - - - - - - - -

/**
+          /**
  * Handles parent element's resizing to perform width/height smooth transitions
  * when child element is being animated
  * @module resize-parent
@@ -158,24 +155,33 @@ Source: resize-parent.js
 export { initParentResize, endParentResize };

/**
+          /**
  * Handle user defined transitions to not conflict with js-css-animations transitions
  * @module transitions
  */
@@ -216,24 +213,33 @@ Source: transitions.js
 };

Source: animate.js

Source: animate.js

Source: animate.js

Source: globals.js

Source: globals.js

Source: globals.js

JS-CSS Animations

JS-CSS Animations

Source: js-css-animations.js

Source: js-css-animations.js

Source: js-css-animations.js

Source: measurements.js

Source: measurements.js

Source: measurements.js

Module: animate

Members

(static, constant) removeCustomCssProperties

(static, constant) setCssProperty

(inner, constant) CALLBACK_TRACKER :Object

Type:

(inner, constant) CONFIG :Object.<string, any>

Type:

(inner, constant) DURATION_REGEX

(inner, constant) TARGETS_STACK :Object

Type:

(inner, constant) configHandler

(inner, constant) configurations :Object.<string, any>

Type:

(inner) trigger

Methods

(inner) animate(element, action, id, opts)

Parameters:

(inner) disable(element)

Parameters:

(inner) enable(element)

Parameters:

(inner) endVisibilityToggle(element, opts)

Parameters:

(inner) eventHandler(el, animationId, opts)

Parameters:

Returns:

(inner) getAction(element, animType)

Parameters:

Returns:

(inner) getTargetSelector(eventTarget)

Parameters:

Returns:

(inner) getTimeInMs(value)

Parameters:

Returns:

(inner) getTotalAnimTime(element)

Parameters:

Returns:

(inner) handleVisibilityToggle(element, args)

Parameters:

(inner) hasIterationProp(element)

Parameters:

Returns:

(inner) init(trigger)

Parameters:

(inner) init(animationId, opts)

Parameters:

(inner) initCallback(trigger, fn, type)

Parameters:

(inner) isEnabled(element)

Parameters:

Returns:

(inner) isMotion(animType)

Parameters:

Returns:

(inner) isVisibility(animType)

Parameters:

Returns:

(inner) preset(el, args)

Parameters:

(inner) remove(trigger)

Parameters:

(inner) removeMotionCssClass(element)

Parameters:

Module: animate