Hopiu/jquery-mobile
1
0
Fork 0
mirror of https://github.com/Hopiu/jquery-mobile.git synced 2026-04-27 17:34:45 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Moved the transition sampler page to a multi-page format to avoid the loader every time you want to try a transition. Leaving the old page here for now because we may link to it elsewhere.

Browse source
This commit is contained in:
toddparker 2011-08-26 17:00:44 -04:00
parent 01f61cfd54
commit 66fb6bba2f
1 changed files with 24 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
docs/pages/page-transitions.html
View file

@ -33,12 +33,12 @@
</code></code>
<p>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="slide" data-prefetch>slide</a>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="slideup">slideup</a>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="slidedown">slidedown</a>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="pop">pop</a>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="fade">fade</a>
<a href="transition-success.html" data-role="button" data-rel="dialog" data-transition="flip">flip *</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="slide">slide</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="slideup">slideup</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="slidedown">slidedown</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="pop">pop</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="fade">fade</a>
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="flip">flip *</a>
</p>
<p>NOTE: The flip transition isn't rendered correctly on most versions of Android because it lacks 3D CSS transform capabilities. Unfortunately, instead of ignoring the flip, Android makes the page "cartwheel" away by rotating instead of flipping. We recommend using this transition sparingly until support improves.</p>
@ -83,6 +83,24 @@
</div>
</div><!-- /page -->
<div data-role="page" id="dialog"><!-- dialog-->
<div data-role="header" data-theme="e">
<h1>Ta-da!</h1>
</div><!-- /header -->
<div data-role="content" data-theme="e">
<p>That was an animated page transition effect that we added with a <code>data-transition</code> attribute on the link.</p>
<p>Since it uses CSS transforms, this should be hardware accelerated on many mobile devices.</p>
<p>What do you think?</p>
<a href="docs-transitions.html" data-role="button" data-theme="b" data-rel="back">I like it</a>
</div>
</div>
</body>
</html>