[펌] 홈페이지 접속시 모바일 페이지로 자동으로 이동 <무한루프 문제 해결>
홈페이지 접속시 모바일 페이지로 자동으로 이동 <무한루프 문제 해결>
모바일 기기로 홈페이지 접속시 모바일 페이지로 자동으로 이동하는 소스
우선 도메인 접속시 실행화일 순서는 html, htm, php 의 순서이다.
기본 아이디어는 매우 단순하다. 접속시 맨 먼저 실행되는 index.htm에서 판단해서, 모바일기기에서 접속하면 모바일 홈페이지로 연결하고, PC에서 접속하면 PC 홈페이지로 연결하면 되겠다.
맨 먼저 판단하는 화일, PC홈페이지 파일, 모바일 홈페이지 파일 세 개로 구성된다.
=== index.htm ===
<html>
<head>
<script language="JavaScript" type="text/JavaScript">
var mobileKeyWords = new Array('iPhone', 'iPod', 'BlackBerry', 'Android', 'Windows CE', 'LG', 'MOT', 'SAMSUNG', 'SonyEricsson');
for (var word in mobileKeyWords){
if (navigator.userAgent.match(mobileKeyWords[word]) != null){
parent.window.location.href='모바일 홈페이지 주소/실행화일';
break;
}
var mobileKeyWords = new Array('iPhone', 'iPod', 'BlackBerry', 'Android', 'Windows CE', 'LG', 'MOT', 'SAMSUNG', 'SonyEricsson');
for (var word in mobileKeyWords){
if (navigator.userAgent.match(mobileKeyWords[word]) != null){
parent.window.location.href='모바일 홈페이지 주소/실행화일';
break;
}
}
</script>
</script>
</head>
<frameset cols="0, *" frameborder="0" border="0">
<frame name="contents" noresize>
<frame src="PC 홈페이지 주소/실행화일" name="detail" noresize>
</frameset>
<frame name="contents" noresize>
<frame src="PC 홈페이지 주소/실행화일" name="detail" noresize>
</frameset>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"></body>
</html>
</html>
중요한 것은, 위의 빨간색 부분 parent.window. 를 붙이지 않으면 모바일 페이지가 큰 화면에 조그만 사이즈로 뜨게 된다능. 꼭 붙일 것.
자기 홈페이지 주소 앞에 m.을 붙여서 서브 도메인 만드는 법은 네이버 검색을 해보시오.
그런 다음 모바일 홈페이지와 PC 홈페이지에서 각각 [PC버전 바로가기] [모바일버전 바로가기] 링크를 서로 걸어주면 되겠다.^^
(주의!) 위와 같이 하지 않고 위의 "모바일기기 판단부분" 소스를 PC용 웹페이지 상단에 넣어주면, 모바일기기에서 [PC버전]을 클릭해도 계속해서 모바일 버전만 뜨게 된다. 즉, 무한루프에 빠지게 된다.
[출처] 홈페이지 접속시 모바일 페이지로 자동으로 이동 <무한루프 문제 해결>|작성자 일귀하처
|
댓글을 작성하시려면 로그인이 필요합니다.
댓글 14개
제공해 주셔서 감사드립니다.
테스트해보니 잘 됩니다. ^^
정말 감사합니다.
parent.window.location.href='모바일 홈페이지 주소/실행화일';
이거 딱 한 줄이면 해결되는걸 몰랐습니다.
해당 스크립트 보시면 해당 기기를 계속 체크하면서 반복 하는 부분이라서
해당 자바스크립트 적용시 모바일 페이지는 바로 열리나 PC버젼에서는
해당 기기를 다 체크하고서 이동하는 부분이라서
원하는 페이지 이동시 매우 늦게 이동합니다. (php스크립트로 적용해야 됩니다.)
어렵게 고민하던 문제 해결했습니다!!
ipad는 추가만 하면 되나요?