Announcing jquery.mobile.simultaneous-transitions, 1.0

Announcing jquery.mobile.simultaneous-transitions, 1.0

I'm pleased to announce the release of jquery.mobile.simultaneous-transitions:


It's not exactly a plugin (yet). What it is is a simple set of files that you can drop-in to your head and replace the sequential transitions in jQuery Moblle 1.1.1 with the corresponding simultaneous transitions from jQuery Mobile 1.0.1

The repo also include an optional fix for bug #4340 which has not yet been incorporated in a publc release of jQuery Mobile. This fix is needed for the smoothest, artifact-free display of transitions. (The fix is derived directly from jQuery Mobile master source.)

While jQuery Mobile includes the necessary support for inclusion of these original, simultaneous transitions, it is up to developers to add them - the've been removed from the library. A number of blogs have addressed the issue, but until now it has remained a manual cut-and-paste task for developers. I felt that it was time to create a repo so that we don't all have to re-invent the same wheel.

From the readme:
Starting with jQuery Mobile version 1.1, default page transitions were changed. In previous versions, jQuery Mobile used page transitions originally derived from jqTouch. These transitions all work simultaneously - that is, the "in" and "out" transitions occur at the same time.

These transitions have a very smooth appearance, and have been well-liked by users and developers, but have a drawback: they don't hide the necessary scrolling of outgoing pages to the top and incoming pages to a remembered scroll position. However, this does not occur if (as if often the case for webApps or native apps) the page does not need to be scrolled. Pages do not need to be scrolled during transition if their height does not exceed the viewport height. This is true if pages are designed to viewport height.

As part of a design that does not exceed viewport height, a site or app might use a scroller, such as `jquery.mobile.iscrollview`, or `jquery.mobile.scrollview`. However, this is not necessary requirement for using simultaneous transitions - all that is necessary is that either:

- the page height does not exceed the viewport height, or
- the developer must be willing to accept visible scrolling of pages during transitions

The default transitions (starting with jQuery Mobile 1.1) now use a sequential transition handler. This means that the "out" transition is first performed, followed by the "in" transition. Additional transition steps have been added to attempt to hide scrolling.

Unfortunately, these transitions do not have the smooth appearace of the previous, simultaneous transitions. Many find them distracting, unattractive, and just plain "goofy". They have been widely un-liked by much of the jQuery Mobile developer community, particularly by those using jQuery Mobile as part of an environment for building native apps for mobile devices. Apple has shown an unwillingness to accept applications using these transitions in the App Store, because their appearance does not meet with their appearance standards.

(As a small concession, the `slide` transition in jQuery Mobile does still use a simultaneous transition.)

jQuery Mobile does still include a simultaneous transition handler. However, the simultaneous transitions have been removed, so it is up to developers to add them if wanted.

This repo provides an easy way to either replace the corresponding default transitions with those from jQuery Mobile 1.0.1, or else add new simultaneous transitions, which have the same name as the previous transitions, but with a suffix of `-sim`.