Hoe kan je in een webapp een navigatie bar maken zoals op de iphone?

The default look of a web page is pretty bad. Simple white background with ugly black lettering. Nothing nice.

With the iPhone though, it doesn’t look half as bad, and now, thanks to Joe Hewitt (again) there is an even better base.

You can simply use his native looking navigation skin to make your applications look and feel like a native iPhone application.

The magic sits in:

iphonenav.js: The JavaScript handles getting rid of the browser url bar, the back button (Safari finally supports changing the hash nicely!), changing based on the orientation, swiping a page across, and more.
iphonenav.css: The CSS makes the standard elements look like real iPhone elements thanks to magic like “-webkit-border-image: url(iPhoneButton.png) 0 8 0 8;”
There is still more to do of course. It would be great to give developers simple access to the red deletes, the blue buttons, the twisty round deletes, and more. This allows anyone to build an app that will look decent and just like the iPhone apps that users are used too.

Toegevoegd op 18-05-2009 11:43:08
EDIT:

Koop een echte telefoon...

Telerik heeft hier een goede control voor. Andere optie zou in Flash of SilverLight zijn. Tenslotte kun je ook nog een javascript gaan schrijven.