up.morph() - Unpoly

Performs an animated transition between the source and target elements.

Transitions are implement by performing two animations in parallel, causing source to disappear and the target to appear.

target is inserted before source
source is removed from the document flow with position: absolute. It will be positioned over its original place in the flow that is now occupied by target.
Both source and target are animated in parallel
source is removed from the DOM

The following transitions are pre-defined:

`cross-fade`	Fades out the first element. Simultaneously fades in the second element.
`move-up`	Moves the first element upwards until it exits the screen at the top edge. Simultaneously moves the second element upwards from beyond the bottom edge of the screen until it reaches its current position.
`move-down`	Moves the first element downwards until it exits the screen at the bottom edge. Simultaneously moves the second element downwards from beyond the top edge of the screen until it reaches its current position.
`move-left`	Moves the first element leftwards until it exists the screen at the left edge. Simultaneously moves the second element leftwards from beyond the right edge of the screen until it reaches its current position.
`move-right`	Moves the first element rightwards until it exists the screen at the right edge. Simultaneously moves the second element rightwards from beyond the left edge of the screen until it reaches its current position.
`none`	A transition that has no visible effect. Sounds useless at first, but can save you a lot of `if` statements.

You can define additional named transitions using up.transition().

You can also compose a transition from two named animations. separated by a slash character (/):

During a transition both the old and new element occupy the same position on the screen.

Since the CSS layout flow will usually not allow two elements to overlay the same space, Unpoly:

The old and new elements are cloned
The old element is removed from the layout flow using display: hidden
The new element is hidden, but still leaves space in the layout flow by setting visibility: hidden
The clones are absolutely positioned over the original elements.
The transition is applied to the cloned elements. At no point will the hidden, original elements be animated.
When the transition has finished, the clones are removed from the DOM and the new element is shown. The old element remains hidden in the DOM.

up.motion up.morph(source, target, transition, [options])
JavaScript function