아이폰 웹개발시 팁

웹페이지를 모바일에서 볼 경우 모바일기기의 크기에 맞게 웹페이지를 보려면 <header>에 다음과 같은 메타태그를 넣어주면 된다.

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />

아이폰 또는 아이팟에서 웹페이지를 호출하면 로딩이 끝남과 동시에 주소창이 위로 올라가는 경우가 있는데 마찬가지로 <header>에 다음과 같은 자바스크립트 코드를 넣어주면 된다.

if(navigator.userAgent.match(/mobile/i)){
    window.addEventListener('load',function(){
        setTimeout(scrollTo,0,0,1);
        },false);
}