Hub.AnimationType property

  • Article

Specifies the type of Hub animation used when a contentanimating event is raised.

Syntax

<div data-win-control="WinJS.UI.Hub" data-win-options="{ AnimationType : value}" />

var animationType = hub.animationType;

Property value

Type: string

One of these values defines when the animation is played:

Value Condition
"entrance"

The animation plays when the Hub is first displayed. This is the default value.
"contentTransition"

The animation plays when the Hub is changing its content.
"insert"

The animation plays when a section is inserted into the Hub.
"remove"

The animation plays when a section is removed into the Hub.

 

Examples

The following example shows how you can use this property to do something when these animation events happen, even how to cancel the animation.

        var hub = new WinJS.UI.Hub();
        hub.addEventListener("contentanimating", function (e) {
            if (e.detail.type === WinJS.UI.Hub.AnimationType.contentTransition) {
                // The hub wants to play a content transition animation. 
                // You can stop the animation by calling e.preventDefault() here.
                // Do something else here.
            } else if (e.detail.type === WinJS.UI.Hub.AnimationType.entrance) {
                // The hub wants to play an entrance animation. 
                // You can stop the animation by calling e.preventDefault() here.
                // Do something else here.
            } else if (e.detail.type === WinJS.UI.Hub.AnimationType.insert) {
                // The hub wants to play an insertion animation on a newly added hub section. 
                // You can stop the animation by calling e.preventDefault() here.
                // Do something else here.
            } else if (e.detail.type === WinJS.UI.Hub.AnimationType.remove) {
                // The hub wants to play a remove animation on a removed hub section. 
                // You can stop the animation by calling e.preventDefault() here.
                // Do something else here.
            }
        });

Requirements

Minimum WinJS version

WinJS 2.0

Namespace

WinJS.UI

See also

Hub