MobileWeb 시작하기. 디바이스 별 해상도 갤럭시 S : 480*800 ( 옴티머스, 갤럭시, 베가 ) 안드로이드폰 / 아이폰 3G : 320*480 아이폰 4 : 640 *960 아이패드 : 1024*768 갤럭시탭 : 1024*600.

Presentation on theme: "MobileWeb 시작하기. 디바이스 별 해상도 갤럭시 S : 480*800 ( 옴티머스, 갤럭시, 베가 ) 안드로이드폰 / 아이폰 3G : 320*480 아이폰 4 : 640 *960 아이패드 : 1024*768 갤럭시탭 : 1024*600."— Presentation transcript:

1 MobileWeb 시작하기

2 디바이스 별 해상도 갤럭시 S : 480*800 ( 옴티머스, 갤럭시, 베가 ) 안드로이드폰 / 아이폰 3G : 320*480 아이폰 4 : 640 *960 아이패드 : 1024*768 갤럭시탭 : 1024*600

3 Opera Mobile emulator 다운로드 : http://www.opera.com/developer/tools/http://www.opera.com/developer/tools/ 마우스를 통한 드레그앤 드롭이 가능 Resolution : 랜드스케이프 : 가로 / 포트레이트 : 세로

4 Opera Mini Simulator 시뮬레이터 주소 : http://www.opera.com/mobile/demo/http://www.opera.com/mobile/demo/ 웹에서 직접사용하나 한글 버전에선 글자 깨짐 현상이 발생하며, 별도의 자바 파일을 설치해야 볼 수 있음.

5 아이폰 시뮬레이터 주소 : http://www.testiphone.com/ http://www.testiphone.com/ This is a web browser based simulator for quickly testing your iPhone web applications. This tool has been so far tested and working using Internet Explorer 7, FireFox 2 and Safari 3.

6 아이폰 (MobiOne Installer) 다운로드 주소 : http://www.genuitec.com/mobilehttp://www.genuitec.com/mobile 시작 > 모든 프로그램 > Mobione Studio > Mobione test Center 으로 시작 Alt + 마우스왼쪽 : 멀티터치 / Ctrl + 마우스왼쪽 : 스크롤

7 아이폰 ( 파이어폭스 시뮬레이터 ) 다운로드 주소 : http://firemobilesimulator.org 1) FF 에서 위 주소 (http://firemobilesimulator.org) 접속한다. 2) 우측에 두번째 메뉴 ( 다운로드 ) 클릭 3) 젤 위에 상위 버전을 클릭 다운로드 및 파이어폭스에 설치 하고 브라우저 다시 시작 4) FF 상단에서 도구 > Firemobilesimulator > SBiPhone 3G 5) 기능을 끄고 싶으면 도구 > Firemobilesimulator > 젤위 한문으로 뭐시기 클릭하면 끝

8 아이패드 시뮬레이터 주소 : http://ipadpeek.com/ http://ipadpeek.com/ 사파리를 통해 오픈 하는 것이 좋음.

9 유용한 사이트 사이트모음 - http://www.umoby.co.kr/kor/main.phphttp://www.umoby.co.kr/kor/main.php 외국 사이트모음 - http://www.mobileawesomeness.com/http://www.mobileawesomeness.com/ 사이트모음 2 - http://www.mobilecast.co.kr/?mid=mobilewebhttp://www.mobilecast.co.kr/?mid=mobileweb 영화사이트 - http://m.movist.com/http://m.movist.com/ 유용한 사이트 - http://zeronara.net/bbs/board.php?bo_table=mobilehttp://zeronara.net/bbs/board.php?bo_table=mobile 셀렉트박스 ( 라디오버튼, check box) 에 디자인 입히는 방법 http://www.readactor.com/articles/jquery-checkbox-radio-button-and-selectbox-css-styling-solutions/