jQuery Forum

Do a search here on page transitions, you'll find lots of discussions about it, as well as several ways to address that. It's a (well) known issue with 1.1 transitions, and has been reported, at least in one case, to have an app rejected from Apple. watusiware created a script that can revert them to the 1.0.1 types more or less.

As far as images loading slowly, that seems really strange, particularly if they're local. Are you sure they're not really large in size? Also, setting the dimensions in the <img> tag can make them appear to load more quickly (less page jumping).

I'm on iPhone 4S it's the same, I want a dialog to appear, it flashes, disappears and then comes back up with the page transition...does NOT look great.

Also search this form for CSS tricks for iOS. You need to hint WebKit to pre-cache elements. There is no one solution for all cases. You may need to do a bit of noodling. Search for "translateZ(0)"

I can say that I am using 1.1.1 and 1.2 alpha on iOS with Rhodes (not PhoneGap, but essentially the same browser environment) with no transition problems at all.

But I am using iScroll with my plugin, and my own transition plugin, as well as the CSS trick. It just works the way it should have in the first place.

(You need to use iScroll or some similar solution as a practical matter if you are going to use 1.0 (simultaneous) transitions.)

https://github.com/jquery-mobile-iscrollview

https://github.com/jquery.mobile.simultaneous-transitions

I've added a small handful of new transitions (slideoverleft, slideoverright, slidepushup, slidepushdown), and will be adding more in the future.

There is a demo for iscrollview, but it hasn't yet been updated with the simultaneous transitions for 1.1. I plan on doing that soon, and/or providing a demo for the simultaneous transitions.

@watusiware,

I have been using vclick for buttons inside of scrollers, and vmousedown for non-scrolling buttons. So, inside of scrollers, it fires when the user lifts their finger. Outside of scrollers, it fires as soon as the user touches. This is great for an application menu.

I use vclick inside of scrollers because of the logical impossibility of using vmousedown, since there's no way of knowing in advance (without some quantum-entanglement technology... ;) ) whether the user is intending to tap or scroll when they first touch the screen.

I don't use <a> tags or buttons, but simply attach a vclick or vmousedown handler to a <div>. Of course, then, you have to handle any "button down" and "selected" states yourself (and clear them upon returning to the page from a link). By not using <a> or buttons, I don't have to worry about either the browser or JQM applying effects that I don't want them to apply.

I will use some data- attribute to hold an ID or url, and the handler reads that. So, you can reduce the weight of your HTML in lists by just using, say, a numeric ID rather than a full URL, because the Javascript can form the URL from the ID. (You might want to have some data- attribute with

It's really quite simple to do. I'm not sure why so many of the solutions presented for this are so complex. I haven't had any issues with "phantom clicks" from vclick, but it might just be lucky placement of UI elements.

If you combine this with "none" transitions and write your own lists from simple HTML (instead of using the bloated listview), you can produce native apps with HTML UIs using jQuery Mobile that feel native and respond instantly.

Dears,

Hello.