coding a web page for viewing on iphone

Question

Now I've seen loads of websites that look great on the iphone, such as http://twitter.com and http://deviantart.com however I can't for the life of me get the right structure within my mobile web application to make it show up as if it was an iphone application.

I've discovered iphone jquery ( http://jqtouch.com ) which seems to be the most promising javascript lib for developing nice effects to make everything look authentic. However I'm still having issues with getting the website to fill the screen on iphone safari.

I can never find any resourceful websites that actually explain how to get the effect of having it fully zoomed in and filling the screen.

Are there any libraries that help develop websites for mobile devices such as iphones.

Answer 1

The one I've used this in the past is the iui library and it worked well for my case. The example code makes it pretty easy to understand.

Answer 2

To run fullscreen the webpage needs to be run as a webapp (bookmaked on the homescreen). You also need to indicate in your HTML that it is a web app.

Taken from this website :

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />

Answer 3

Or checkout JQTouch. You can get up and running very quickly.