Zoom in Transition / Animation With jQuery or CSS

Question

On iOS 7, when you click on an app, the screen zooms into the icon and the welcome screen of the app fades in after. Is there a way to simulate this effect with jQuery or any JavaScript or CSS library?

Answer 1

Nice observation :)

My solution would be to keep the icon as a div where you will present the next screen. On touch of it apply a scale and make it fullscreen then call ajax to load the elements. Once done apply a fade in.. it will be combination of css/js. I will come with a fiddle

Answer 2

Looked around and found nothing that did anything close to what you see on iOS. I looked into CSS zoom and transform, but unless you have a single page website, there's is really no way for you to transition between different pages in the same way as when you click on an app icon on an iPhone or iPad.