WinJS.UI.Animation Namespace

Article
01/26/2017

Provides access to the Windows animations. These functions provide developers with the ability to use animations in their custom controls that are consistent with animations used by Windows controls.

For more info about adding animation to your app, see Animating your UI.

The WinJS.UI.Animation namespace has these types of members:

Functions

Functions

Function	Description
continuumBackwardIn	Scales down an incoming page while scaling, rotating (counterclockwise), and translating an incoming item into place.
continuumBackwardOut	Scales an outgoing page as it is removed.
continuumForwardIn	Scales up an incoming page while scaling, rotating (clockwise), and translating an incoming item into place.
continuumForwardOut	Scales down a page while scaling, rotating (clockwise), and translating an outgoing item.
createAddToListAnimation	Creates an object that performs an animation that adds an item or items to a list.
createAddToSearchListAnimation	Creates an object that performs an animation that adds an item or items to a list of search results.
createCollapseAnimation	Creates an object that performs an animation that collapses a list.
createDeleteFromListAnimation	Creates an object that performs an animation that removes an item or items from a list.
createDeleteFromSearchListAnimation	Creates an object that performs an animation that removes an item or items from a list of search results.
createExpandAnimation	Creates an object that performs an animation that expands a list.
createPageNavigationAnimations method	Creates an exit and entrance animation to play for a page navigation given the current and incoming pages' animation preferences and whether the pages are navigating forwards or backwards.
createPeekAnimation	Creates an object that performs a peek animation.
createRepositionAnimation	Creates an object that performs an animation that moves an item or items.
crossFade	Performs an animation that fades an item or items in, fading out existing items that occupy the same space.
dragBetweenEnter	Performs an animation when a dragged object is moved such that dropping it in that position would move other items. The potentially affected items are animated out of the way to show where the object would be dropped.
dragBetweenLeave	Performs an animation when a dragged object is moved away from items that it had previously involved in a dragBetweenEnter animation. The affected objects are animated back to their original positions.
dragSourceEnd	Performs an animation when the user finishes dragging an object.
dragSourceStart	Performs an animation when the user begins to drag an object.
enterContent	Performs an animation that displays one or more elements on a page.
enterPage	Performs an animation that shows a new page of content, either when transitioning between pages in a running app or when displaying the first content in a newly launched app.
exitContent	Performs an animation that hides one or more elements on a page.
exitPage	Performs an animation that dismisses the current page when transitioning between pages in an app.
fadeIn	Performs an animation that fades an item or set of items into view.
fadeOut	Performs an animation that fades an item or set of items out of view.
hideEdgeUI	Performs an animation that hides edge-based user interface (UI).
hidePanel	Performs an animation that hides a panel.
hidePopup	Performs an animation that removes pop-up user interface (UI).
pointerDown	Performs an animation when a pointer is pressed on an object.
pointerUp	Performs an animation when a pointer is released.
showEdgeUI	Performs an animation that slides a narrow, edge-based user interface (UI) into view.
showPanel	Performs an animation that slides a large panel user interface (UI) into view.
showPopup	Performs an animation that displays a pop-up user interface (UI).
slideDown	Slides elements off through the bottom of the screen.
slideLeftIn	Slides elements in from the left side of the screen.
slideLeftOut	Slides elements out through the left side of the screen.
slideRightIn	Slides elements in from the right side of the screen.
slideRightOut	Slides elements out through the right side of the screen.
slideUp	Slides elements up into view from the bottom of the screen.
swipeDeselect	Performs a deselection animation in response to a swipe interaction.
swipeReveal	Performs an animation that reveals an item or items in response to a swipe interaction.
swipeSelect	Performs a selection animation in response to a swipe interaction.
turnstileBackwardIn	Rotates an element counterclockwise onto the page.
turnstileBackwardOut	Rotates an element counterclockwise off the page.
turnstileForwardIn	Rotates an element clockwise onto the page.
turnstileForwardOut	Rotates an element clockwise off the page.
updateBadge	Performs an animation that updates a badge.

Requirements

Minimum WinJS version	WinJS 1.0
Namespace	WinJS.UI.Animation

WinJS.UI.Animation Namespace

Functions

Requirements

See also

Additional resources