Edit this page

up.motion [up-transition]
HTML selector

Swaps a fragment with an animated transition.

You can use a predefined transition or define your own.

Note

Transitions are not possible when replacing the <body> element.

The link will load the fragment #story from the URL /page2. Once the response is received, the old fragment version will fly out to the left, while the new version will fly in from the right.

<a href="/page2"
  up-target="#story"
  up-transition="move-left">
  Next page
</a>

The form will load the fragment .content from the URL /tasks. Once the response is received, the old fragment version will fade out, while the new version will fade in.

<form action="/tasks"
  up-target=".content"
  up-transition="cross-fade">
  ...
</form>

Modifying attributes

Info

All attributes for [up-follow] (links) or [up-submit] forms may also be used.

[up-transition] optional
[up-fail-transition] optional

The transition to use when the server responds with an error code.

See Handling failed responses.