Please turn on JavaScript. To find out how to do this visit the WebWise JavaScript guide.

Functions for modifying animations

Further Info & Examples

Methods

bounceBoth

Returns a combination of bounceIn and bounceOut

Synopsis

glow.tweens.bounceBoth();

Returns

bounceIn

Returns the reverse of bounceOut

Synopsis

glow.tweens.bounceIn();

Returns

bounceOut

Returns a tween which bounces against the final value 3 times before stopping

Synopsis

glow.tweens.bounceOut();

Returns

combine

Create a tween from two tweens.

Synopsis

glow.tweens.combine(tweenIn, tweenOut);

Parameters

tweenIn
Type
Function

Tween to use for the first half

tweenOut
Type
Function

Tween to use for the second half

Returns

Description

This can be useful to make custom tweens which, for example, start with an easeIn and end with an overshootOut. To keep the motion natural, you should configure your tweens so the first ends and the same velocity that the second starts.

Example

// 4.5 has been chosen for the easeIn strength so it
// ends at the same velocity as overshootOut starts.
var myTween = glow.tweens.combine(
  glow.tweens.easeIn(4.5),
  glow.tweens.overshootOut()
);
easeBoth

Creates a tween which starts off slowly, accelerates then decelerates after the half way point.

Synopsis

glow.tweens.easeBoth(strength);

Parameters

strength
Type
Number
Default
2
Optional
Yes

How strong the easing is.

A higher number produces a greater difference between start / end speed and the mid speed.

Returns

Description

This produces a smooth and natural looking transition.

easeIn

Creates a tween which starts off slowly and accelerates.

Synopsis

glow.tweens.easeIn(strength);

Parameters

strength
Type
Number
Default
2
Optional
Yes

How strong the easing is.

A higher number means the animation starts off slower and ends quicker.

Returns

easeOut

Creates a tween which starts off fast and decelerates.

Synopsis

glow.tweens.easeOut(strength);

Parameters

strength
Type
Number
Default
2
Optional
Yes

How strong the easing is.

A higher number means the animation starts off faster and ends slower

Returns

elasticBoth

Returns a combination of elasticIn and elasticOut

Synopsis

glow.tweens.elasticBoth(amplitude, period);

Parameters

amplitude
Type
Number
Default
1
Optional
Yes

How strong the elasticity is.

period
Type
Number
Default
0.3
Optional
Yes

The frequency period.

Returns

elasticIn

Returns the reverse of elasticOut

Synopsis

glow.tweens.elasticIn(amplitude, period);

Parameters

amplitude
Type
Number
Default
1
Optional
Yes

How strong the elasticity is.

period
Type
Number
Default
0.3
Optional
Yes

The frequency period.

Returns

elasticOut

Creates a tween which has an elastic movement.

Synopsis

glow.tweens.elasticOut(amplitude, period);

Parameters

amplitude
Type
Number
Default
1
Optional
Yes

How strong the elasticity is.

period
Type
Number
Default
0.3
Optional
Yes

The frequency period.

Returns

Description

You can tweak the tween using the parameters but you'll probably find the defaults sufficient.

linear

Returns linear tween.

Synopsis

glow.tweens.linear();

Returns

Description

Will transition values from start to finish with no acceleration or deceleration.

overshootBoth

Returns a combination of overshootIn and overshootOut

Synopsis

glow.tweens.overshootBoth(amount);

Parameters

amount
Type
Number
Default
1.70158
Optional
Yes

How much to overshoot.

The default is 1.70158 which results in a 10% overshoot.

Returns

overshootIn

Returns the reverse of overshootOut

Synopsis

glow.tweens.overshootIn(amount);

Parameters

amount
Type
Number
Default
1.70158
Optional
Yes

How much to overshoot.

The default is 1.70158 which results in a 10% overshoot.

Returns

overshootOut

Creates a tween which overshoots its end point then returns to its end point.

Synopsis

glow.tweens.overshootOut(amount);

Parameters

amount
Type
Number
Default
1.70158
Optional
Yes

How much to overshoot.

The default is 1.70158 which results in a 10% overshoot.

Returns

Documentation generated by JsDoc Toolkit 2.1.0 on Mon Sep 14 2009 14:39:12 GMT+0100 (BST)

BBC navigation

BBC © 2014 The BBC is not responsible for the content of external sites. Read more.

This page is best viewed in an up-to-date web browser with style sheets (CSS) enabled. While you will be able to view the content of this page in your current browser, you will not be able to get the full visual experience. Please consider upgrading your browser software or enabling style sheets (CSS) if you are able to do so.