Simple Move And Scroll Animations With JavaScript – pallet-animate

Preview:

Description:

The pallet-animate JavaScript library provides smooth and performant move and scroll animations on DOM elements.

More Examples:

• Move Example
• Scroll Example

How to use it:

Download and link to the pallet-animate library.

<script src="pallet-animate.js"></script>

The JavaScript to move an element relative to its container. The specified element must have a position set to either relative, absolute, or fixed. Good for carousels. Available parameters:

• identifier: required
• direction: required
• next: OPTIONAL Function to be called when done.
• step: OPTIONAL Step size for animation interval (controls speed).
• distance: OPTIONAL number of pixels to move, defaults to width or height of the parent element for horizontal or vertical movements respectively.
• index: OPTIONAL If a non-unique identifier is passed use this as the index to use. Defaults to 0.

ptanimate.move(identifier, direction, callback, step, distance, index)

The JavaScript to add/remove Class based on the location of an element.

• threshold: threshold number of change vertical value
• identifier: required
• classname: required
• mobileDisable: if true will not call function is screen size is of mobile width

ptanimate.scroll(threshold, identifier, classname, mobileDisable)

Changelog:

10/11/2018

• Added pause