본문 바로가기

프로그래밍/jQuery

iPhoneWebDev: Developers Helping Developers



iPhoneWebDev: Developers Helping Developers

Examples

Many thanks to the members of the iPhoneWebDev community for working out solutions to common problems and providing these examples.

iPhone Optimized View Source Bookmarklet

Show/Hide

View Source bookmarklet.

Based on original code by Abe Fettig, adapted to set scale parameters and scroll down to lose the location bar.

The unencoded javascript looks like this:

var sourceWindow = window.open("about:blank"); var newDoc = sourceWindow.document; newDoc.open(); newDoc.write("<html><head><title>Source of " + document.location.href + "</title><meta name=\"viewport\" id=\"viewport\" content=\"initial-scale=1.0;" + "user-scalable=0; maximum-scale=0.6667; width=480\"/><script>function do_onload()" + "{setTimeout(function(){window.scrollTo(0,1);},100);}if(navigator.userAgent.indexOf" + "(\"iPhone\")!=-1)window.onload=do_onload;</script></head><body></body></html>"); newDoc.close(); var pre = newDoc.body.appendChild(newDoc.createElement("pre")); pre.appendChild(newDoc.createTextNode(document.documentElement.innerHTML));

Selecting Different Keypads

Show/Hide

The iPhone automatically starts out with a telephone keypad if the input field has phone anywhere in its name, or with the keyboard in numeric mode if the input field has zip anywhere in its name. You can test it here. Original test page created by Ronan.

Changing CSS After Orientation Change

Show/Hide

Two examples of “sensing” the orientation of the iPhone when it switches between portrait and landscape mode, currently using polling. This (“liquification”) is based on Joe Hewitt's “Liquid Layout” and (“gradient menus”) on Timothy Hatcher's gradient menus: liquified (no gradients); liquified (with gradients)

Emulating a Native iPhone-Style App

Show/Hide

This example from Joe Hewitt shows how to use simple HTML to emulate an iPhone-style application, which also supports the back button for navigation.

iLace: A Simple iPhone Chat

A complete chat application.

Onload hiding of the URL bar

A simple example of hiding the URL bar on page load.

mailto with arguments

A confirmation that mailto: with e.g. subject setting works.

iPhone user detection

Example which determines if the visitor is on an iPhone or not.

Events on the iPhone

A list of events supported by the iPhone (work in progress!).

Fonts on the iPhone

A list of fonts available on the iPhone.

iPhone settings

A list of settings available to the iPhone user.

Bugs

A comprehensive list of known iPhone bugs.

Compression

Compressed (gzip) pages over HTTP for optimized load time.