Solved

website redirect to iphone & smartphone sized webpage - i have iphone script code

Posted on 2010-09-05
12
2,165 Views
Last Modified: 2014-11-12
i have the attached code that works great with iphones

it detects that it is a iphone or ipod touch and redirects to my webpage that
is coded for iphones and ipods.

can anyone help so that it can detect and work with most smartphones?

the first code is the page that detects iphone and redirects
the second code is the actual resized page

thanks

// iphone redirect page //


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IPHONE REDIRECT PAGE</title>

<script>if ((navigator.userAgent.indexOf('iPhone') != -1) ||  
(navigator.userAgent.indexOf('iPod') != -1)) {  
document.location = "http://www.mywebsite.com/iphone.html";  
} </script>


</head>

<body>

</body>

</html>

Open in new window



// actual iphone page //


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IPHONE PAGE</title>
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0;"> 
<link rel="apple-touch-icon" href="images/logo_image.png"/> 

<style type="text/css">
.style1 {
				font-family: "Trebuchet MS";
				font-size: 14pt;
				color: #535353;
}
</style>

</head>

<body style="background-color: #D0E8D0" onorientationchange="updateOrientation();">
<div id="page_wrapper" class="style1">

This is our iPhone Page<br />
<br />
It fits your iphone or ipod touch. if you have it straight up or rotate it.</div>
</body>

</html>

Open in new window

0
Comment
Question by:webdott
  • 6
  • 5
12 Comments
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
0
 

Author Comment

by:webdott
Comment Utility
thanks! - i used the accepted code of the above thread.

it worked with iphone and ipod touch,
but i do not have a windows or blackberry phone to test it with at the moment.
i am trying to upload it to a hosting site so that my friends can test it on these phones.

here is the final code.

does anyone have a windows or blackberry to test it?




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>IPHONE REDIRECT PAGE</title>

<script language="javascript">
	var is_mobile = (/iphone|ipad|ipod|andoid|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent));
	if(is_mobile) window.location = 'http://www.google.com';
</script>

</head>

<body>

<p>see this - redirect did not work</p>

</body>

</html>

Open in new window

0
 
LVL 82

Accepted Solution

by:
leakim971 earned 500 total points
Comment Utility
Starting from here : http://user-agent-string.info/list-of-ua/browser-detail?browser=BlackBerry

We can use lowercase : navigator.userAgent.toLowerCase()

this why it don't work for the EE member in the previous post.
var is_mobile = (/iphone|ipad|ipod|andoid|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));

Open in new window

0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
0
 

Author Comment

by:webdott
Comment Utility
it looks like it will work. i inserted the new code.
it works with the iphone, ipod touch
can anyone check this out with a blackberry, microsoft, andriod phone?
i have seom friends trying it out, but it may take them some time to get back with me.
figured EE would have more people that could test it.
i have it live at     www.myblankweb.com
if it works - you are redirected to google.com
if it doesn't, it tells you you should have been redirected to www.google.com
Thanks
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
coul you replace :

if(is_mobile) window.location = 'http://www.google.com';

by :

if(is_mobile) window.location = 'http://www.google.com';
else alert(navigator.userAgent.toLowerCase());
0
Do You Know the 4 Main Threat Actor Types?

Do you know the main threat actor types? Most attackers fall into one of four categories, each with their own favored tactics, techniques, and procedures.

 

Author Comment

by:webdott
Comment Utility
updated the website www.myblankweb.com
with the following new code.
it has been tested with,
iphone, ipod touch, windows phone HTC Imagio anyone with a blackberry or andriod phone?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">



<head>

<meta http-equiv="Content-Language" content="en-us" />

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<meta name="MobileOptimized" content="width" />



<title>mobile REDIRECT PAGE</title>



<script language="javascript">

	var is_mobile = (/iphone|ipad|ipod|andoid|blackberry|mini|windows\sce|palm/i.test(navigator.userAgent.toLowerCase()));

	if(is_mobile) window.location = 'http://www.google.com';

else alert(navigator.userAgent.toLowerCase());

</script>



<style type="text/css">

.style1 {

				font-family: "Trebuchet MS";

				font-size: 14pt;

}

</style>



</head>



<body>



<p class="style1">If you see this - the code did not work : (</p>

<p class="style1">You should have been redirected to www.google.com</p>



</body>



</html>

Open in new window

0
 

Author Comment

by:webdott
Comment Utility
does the alert have to be there?
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
ok for windows mobile 6.5, for android, you've a typo error, the << r >> is missing : andoid

for blackberry : http://na.blackberry.com/eng/developers/resources/simulators.jsp
0
 
LVL 82

Expert Comment

by:leakim971
Comment Utility
>does the alert have to be there?

no the alert is to debug/display the userAgent so you can understand why it don't work/redirect
the goal is to search string in the userAgent : iphone or ipad or ipod or android or blackberry or mini or windows ce or palm
0
 
LVL 2

Expert Comment

by:sqlgang
Comment Utility
If you are using asp.net - then try out mobile device detection API provided by 51degrees at http://51degrees.codeplex.com/. Using this - you can detect the requesting browser/device on server side along with the width/height of the requesting device's browser, whether it supports CSS/Javascript, various image types etc.. and from there itself - request can be redirected to required lending page which you have optimized for the specific device. Thus, detection of the device property happens on server side and user will just see the final output - without any redirection from the browser. This would give seamless user experience.
0
 

Author Closing Comment

by:webdott
Comment Utility
Excellent this worked ont the phones tested

thanks
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

This article describes how to create custom column layout styles for Bootstrap. The article uses 5 columns to illustrate the concept, but the principle can be extended to any number of columns.
I've been asked to discuss some of the UX activities that I'm using with my team. Here I will share some details about how we approach UX projects.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

771 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

10 Experts available now in Live!

Get 1:1 Help Now