TriggerNote Documentation
TriggerNote Documentation
twitter youtube linkedin google-plus

Tweening Action

The Tweening Action sets the value of a CSS property to an interpolated value based on a JavaScript variable and specified value ranges. It is useful for such things as parallax scrolling and animation.


Tweening Stops

The Stops option contains a JSON-encoded array of arrays of numbers. That may sound complicated, but it's fairly straightforward, once you get the hang of it. A simple example would be:


The meaning of each part of the code will be explained in detail below. Simply put, this setting would mean, "If the JavaScript value is 0, set the CSS value to 10. If the JavaScript value is 100, set the CSS value to 90. In between 0 and 100, calculate a value between 10 and 90."

A slightly more complex example, which will be referred to below, is: