Determine orientation in Web Page

As the height and width of the browser is affected on changing the orientation of the iPhone, Safari provides a Javascript event called onorientationchange on the tag which notifies whenever you tilt the orientation. Safari also provides a property called window.orientation which provides the angle of tilt with 0° being the bottom of the iPhone.


So the code would like something like this in HTML

Debugging Web Pages on iPhone Safari

Developing can be most effective if there is a good ability to know of problems in the developed content. iPhone allows a user to view problems in HTML, CSS, Javascript on web pages by enabling the debug console on Safari.

Enable Debug Console




Debug Console in Action

After enabling the console, going to any web page automatically adds a 48 pixel bar summarizing the debug messages.




Its nice that even tips are presented which goes on to show the effort put into this functionality - where just showing errors is cause for celebration.

iPhone Web Pages Development

The HTML client on an iPhone is a standard full blown browser found on Apple laptops and desktops called Safari.

Safari on iPhone differs very slightly as follows:

• Resources (HTML, CSS, Images, etc.) have to be less than 10MB
• Javascripts are not allowed execution for more than 5 seconds
• Support for a limited set of mime-types - No Flash, Java Applets, SVG, etc.
• No file uploads/downloads
• No Plug-in installations
• Simultaneously only 8 websites can be loaded
• Certain CSS/Javascript actions are disabled for standard user interface behavior
• Mouse hover events
• Hover styles
• Tooltips etc.