Javascript

Code / Javascript — Comments Off
23
Sep 08

iPhone webpage know-how

Here’s some more information vital to making sure you maximize your viewers’ experience when developing for the mobile web, specifically for the iPhone:

Default viewable size (when the iPhone is vertical):

320 pixels wide x 356 pixels tall from the top of the bottom toolbar to the bottom of the address bar.

Optimal vertical screen (with address bar hidden):

320 pixels wide x 412 pixels tall from the top of the bottom toolbar to the very top of the screen.

The way to get the optimum 320 x 412 pixels is to have your page auto-scroll up far enough to hide the address bar. This is achieved with a bit of javascript in your body tag:

<body onload=”setTimeout(function() { window.scrollTo(0, 1) }, 100);”></body>

Scrolling up the address bar can introduce some issues with usability however, as you are hiding the address bar field and the stop/refresh button, so be aware of this.

That’s all for now. I’m accumulating iPhone information as I move along with this project that may or may not get referenced here. Stay tuned.

Code / Javascript — Comments Off
21
Sep 08

iPhone redirect

Here’s a javascript snippet to get your site to redirect visitors using the iPhone browser:

var agent=navigator.userAgent.toLowerCase();
var is_iphone = (agent.indexOf(‘iphone’)!=-1);
if(is_iphone) { window.location =”http://jaymatter.mobi” }