Redirection

If someone visits your website on an iphone, you will want to redirect them to your mobile version.

Using Javascript

if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
if (document.cookie.indexOf(“iphone_redirect=false”) == –1) window.location = “YOURMOBILEURL”;
}

Using PHP

if(strstr($_SERVER[‘HTTP_USER_AGENT’],’iPhone‘) || strstr($_SERVER[‘HTTP_USER_AGENT’],’iPod’))
{
header(‘Location: YOURMOBILEURL’);
exit();
}

An Example with Images

If you put an image ou your site, but you would like it to be different in different orientations, put both into your code, assign the “portrait” class to the image that will be shown in portrait, same for landscape. Then, in your CSS,
In landscape.css…

.portrait{
display:none;
}

In portrait.css…

.landscape{
display:none;
}

Closing Remarks

If you would like to see any other feature for the mobile web, feel free to leave a comment or email [email protected] On a related note, I have been learning iOS development, so, if you would like me to, I can start a basics series regarding iOS coding.

Similar Posts:

• Create a Mobile Web App with HTML5 – Part 1: The Basics
• CSS3 Sliding Images
• Find a User’s Location on a Map with HTML5 and JavaScript