아이폰은 모바일 사파리를 사용하기 때문에 모바일 사파리에서 웹 사이트 개발 참고 팁을 남긴다.
웹사이트를 개발할 때, 단말기 사이즈에 맞게 보여주기 위해서 다음과 같이 메타태그를 추가한다.
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no" />
예제에서는 기본적으로 스케일을 1:1 로 보여지게 하고 사용자 확대는 막아놓은 상태이다.
모바일 사파리는 기본적으로 세로보기가 되고 가로보기가 되는데 이 방향전환에 따라 폰트크기가 달라지는 경우가 있다. 기본적으로 가로보기일때, 폰트사이즈가 커지는 경향이 있다.
그럴때 다음과 같이 스타일 시트에 추가하면 된다.
h1, h2, h3, p, th, td, dt, dd, div, a, li { -webkit-text-size-adjust:none; }
페이지 로드가 완료 된 후 곧장 주소창 입력창을 업애고 싶을 때가 있다.
그럴때는 다음과 같이 스크립트를 입력하면 된다. ( jQuery를 사용한 예제이다. )
$(function()
{
setTimeout(loaded, 100);
});
function loaded()
{
window.scrollTo(0, 1);
}
전화번호 걸기 링크
[code html]
<a href="tel:0102323xxxx">전화걸기</a>
[/code]
SMS 문자보내기 링크
[code html]
<a href="sms:0102323xxxx">문자보내기</a>
[/code]
참고 링크
'개발관련 > 기타' 카테고리의 다른 글
| VS2010 버전을 쓸 때가 되서 (0) | 2010/07/28 |
|---|---|
| 트위터 정리 (0) | 2010/05/13 |
| 아이폰 용 웹사이트 개발 팁 (0) | 2010/01/26 |
| 통신번호 체계-정규식 (0) | 2009/01/07 |
| WebKnight 설치하기 (0) | 2008/12/04 |
| Javascript - KeyCode (0) | 2008/10/28 |
댓글을 달아 주세요