jQuery Mobile: Set Page Transitions for all Pages
In this quick tip we will show you how to set the transition type for all of your pages globally when using jQuery Mobile for mobile Design. This will save us from having to set the transition type on all our buttons and pages. So we end up with less work to do and if we need to change our transition because a platform we are designing for doesn’t support it we can quickly and easily change it.
Like I said this is a quick tip as all we need to do is add a short piece of code to the head of our HTML file.
For what we are doing this line is the most important part of the code:
This line of code is the code that sets the global transition setting for each of our pages. We simply replace the “none” with any of the available transition settings. The list of available transitions is available at the top of this page:
This page also includes full example of how each page transition works.
If for any reason you have a situation where you still need a different transition to the rest of the app you can still override this on the link or button that you want the second transition on as would any other time.
Hope you found this tip useful and see you again soon.