javascript - iphone web page transitions - Stack Overflow

admin管理员组

文章数量:1291043

I am developing a web page for iPhones and iPod Touch's. I am using the Universal iPhone UI framework. I need to have silding page transitions, but can't seem to get it working. Is there a good javascript framework I could use that would make this easier? I've done a lot of normal web dev with jquery, but it doesn't seem to like the iPhone.

I am developing a web page for iPhones and iPod Touch's. I am using the Universal iPhone UI framework. I need to have silding page transitions, but can't seem to get it working. Is there a good javascript framework I could use that would make this easier? I've done a lot of normal web dev with jquery, but it doesn't seem to like the iPhone.

• javascript
• iphone

Share Improve this question Follow asked Mar 3, 2009 at 21:14 user35288user35288

Add a ment  | 

5 Answers 5

Sorted by: Reset to default 3

Try http://code.google./p/iui/

It's a nice little JS framework, among other things, that will help you with the transition aspect. Have a flick through the documentation too, as it'll give you quite a few additional options as well.

Regardless of what framework you're using, the WebKit CSS trasitions are extensions of CSS and were developed with the iPhone and iPhone web-based apps in mind. You can do some very clever, plex animations with no JavaScript and only a few lines of CSS.

Here's what Google finds on the subject.

Try the following frameworks.

• Jo
• Sencha Touch
• jQuery Mobile

These are for serving Web based mobile sites, they can then in turn be made into Apps for Android or iOS using PhoneGap

Of the 3, Sencha is the more mature project and has the most things out of the box. Jo looks very promising and would probably directly pete with Sencha. jQuery mobile is very interesting but just far to early to do any production code with it, too rough around the edges. jQuery mobile takes a different approach to the others as it is html based and it interperates the attributes on tags to turn things into tableviews or menus.

jQuery mobile is quicker to hack together and get your head around, where the other two take a little bit more thinking. But once you figure them out its easy enough.

If you don't want to serve the site via a url at all and want to just build an app then Appcelerator is the way to go. You write code in JS and it makes native Android or iOS apps for you. You will get access to pretty much the full Android/iOS api.

I have coded with appcelerator, however I am no longer going to use it and use one of the above frameworks, probably Sencha for just now. I can get access to the device native apis via PhoneGap and for simpler apps give a great experience cross device via a url.

Reference

Apple's Dashcode IDE has an extensive set of page transition templates for the iPhone. You should be able to fire up a quick project, get the look you want, then export the resulting HTML/CSS/Javascript into your favorite IDE.

The only catch is that it's OSX only.

I've been deep into an iPhone web app project lately. We evaluated iUI, but decided against it for various reasons. Consequently, I've developed most of the same functionality from scratch. While I can't share the code from the actual product (as I'm under NDA), I have been documenting many of the techniques I've used to do certain things. Check out the links below:

• http://segdeha./e/css-transitions/
• http://segdeha./blog/2009/07/19/stupid-webkit-tricks

本文标签： javascriptiphone web page transitionsStack Overflow