UIZE JavaScript Framework

JAVASCRIPT EXAMPLES Animate Position in JavaScript

In this example, the Uize.Fx.fadeStyle method of the Uize.Fx module is animating the position of a silver sphere. Click anywhere on the brushed metal square and the sphere will move to that position. How the sphere moves is decided by the curve(s) used by the Uize.Fx.fadeStyle method. You can change the curve(s) by clicking on one of the links in the "PRESETS" tab. When you choose a preset, a random target position will be chosen for the sphere, and the sphere will then animate to that position using the new curve(s). To animate the sphere again, click a preset link repeatedly, or click the "PREVIEW ANIMATION" button repeatedly, or click anywhere on the metal square. To fool around with the settings for a preset, switch over to the "PARAMS" tab to tweak values and click the "PREVIEW ANIMATION" button to preview changes.