Presentation is loading. Please wait.

Presentation is loading. Please wait.

JQuery Mobile 세미나 스팍스 10 주은진. 웹앱 네이티브 앱 –iOS -> Objective-C –Android -> Java 웹앱 – 웹 표준 기술로 네이티브 앱 수준 까지 개발 목 표 ! –jQueryMobile, Sencha Touch.

Similar presentations


Presentation on theme: "JQuery Mobile 세미나 스팍스 10 주은진. 웹앱 네이티브 앱 –iOS -> Objective-C –Android -> Java 웹앱 – 웹 표준 기술로 네이티브 앱 수준 까지 개발 목 표 ! –jQueryMobile, Sencha Touch."— Presentation transcript:

1 jQuery Mobile 세미나 스팍스 10 주은진

2 웹앱 네이티브 앱 –iOS -> Objective-C –Android -> Java 웹앱 – 웹 표준 기술로 네이티브 앱 수준 까지 개발 목 표 ! –jQueryMobile, Sencha Touch

3 jQueryMobile jQTouch jQuery

4 특징 –HTML 5 마크업 중심의 개발언어 – 웹 표준기술 HTML, CSS, javascript – 쉽다 ! 웹앱 ? –PhoneGap –Appspresso

5 jQueryMobile 을 사용하려면 ?! 만 있으면 되 요 !

6 jQuery Mobile jQueryMobile Hello World Hello world for jQueryMobile 기본화면 !

7 페이지의 구조 jQueryMobile Hello World Hello world for jQueryMobile //data-position=“fixed”

8 내부 (internal) 페이지간 이동 jQueryMobile Hello World click here to move to internal page! Hello world for jQueryMobile This is next page! Hello! Welcome to Page2! Hello world for jQueryMobile

9 Back button 의 필요성 ? Default 로는 없다 ! 이렇게 하면 생겨요 ~

10 다른 버튼 ! Cancel Edit Contact Save

11 Page Transition I'll pop

12 외부페이지 click to go the external Internal page – 기본적으로 page-transition 효과가 들어간다 – 로딩이 빠르다 –Javascript 가 새로 로딩되지 않는다 ! External page –Page-transition 효과가 들어가지 않는다 – 조금 느리고 끊김 현상이 있다 –Javascript 가 새로 로딩된다.

13 리스트 Convention Acura Audi BMW data-inset=“true” data-theme=“c” List divider

14 리스트 응용 ! Count bubble Inbox 12 index.html Search filter

15 그 외 못다룬 리스트..

16

17 Collapsible Data Basic I'm a header I'm the collapsible content. Not collapsed Nested collapsible Collapsible List

18 네비게이션 바 Summary # Favs # Setup #

19 Form Text Input: Search Input: Textarea:

20 Form Flip switch: Off On

21 그 외의 Form…

22 Reference 공식싸이트 –Docs – 공식 설명

23 감사합니다 ^0^


Download ppt "JQuery Mobile 세미나 스팍스 10 주은진. 웹앱 네이티브 앱 –iOS -> Objective-C –Android -> Java 웹앱 – 웹 표준 기술로 네이티브 앱 수준 까지 개발 목 표 ! –jQueryMobile, Sencha Touch."

Similar presentations


Ads by Google