Question

I’m using .changePage

$.mobile.changePage($nextPage.attr('href'), { transition: 'slide', showLoadMsg: false });

Which is working ok. The page changes and slides in. The only problem is that on the new page there is an image at the top of the page that is not shown during the animation and then “pops” in after the animation.

I thought that changePage would get the page via ajax and load the result into the dom and when thats done do the animation?

It seems like changePage is getting the page and inserting it into the dom but NOT waiting tell that “page” is done loading before doing the animation.

Any one have any thoughts as to how to wait tell the new page and its various assets (an image in this case) is done loading before animating?

Answer 1

In the end the only way I was able to solve this was by pre-loading the page using $.mobile.loadpage