[6.8]페이지

[07장. 멀티 페이지와 화면 이동]

7.1 <div> 페이지 이동
페이지는 단순히 <div>태그이므로 호출한 화면 쉽게 이동 됩니다.
-페이지 이동을 <a>태그가 아닌 제이쿼리에서 제어하는 것이 더 유용하다. 링크를 없애고 <input>버튼으로 변경하기
-페이지가 이동할 경우 changeHash 옵션을 주어 false로 설정할 경우 URL주소는 더 이상 표시 되지 않는다.
==================

===================
===================
※ 프로그램 개발 시 고려 할 점 3가지
- 환경 설정 및 실행방법.
- 화면의 컴포넌트에서 읽고 쓰기.
- 화면 이동 시 파라미터 전달.
====================
====================

7.2 div 페이지 파라미터 전달
-동일한 html 파일 내에서 페이지간 파라미터를 전달해 보기
 - 방법1: 페이지가 이동할 떄 이전 페이지의 위젯의 val()값을 읽어와 처리한다.
 - 방법2: 페이지 이동 시 파라미터를 전달하기 위해 data에 값을 추가하여 보낸다.

====================

 

====================

7.3 html 페이지 이동

 

 

7.5 탭바와 페이지 이동
: 네비게이션바(탭바)와 화면이 상호 일치될 경우 하나의 탭화면이 완성됨.

 

 

 

 

=======================================

 

7.6 페이지 변환 효과
- 페이지 이동 시 움직임에 대한 효과를 보여줌 = 마치 모바일 웹이 마치 앱과 같은 효과를 갖게 됨
===============

 

===============

[8장. 제이쿼리 모바일과 CSS] https://themeroller.jquerymobile.com/
8.1 테마롤러 for 제이쿼리 모바일
 - 테마롤러는 제이쿼리 모바일 화면의 색상 위주의 디자인을 돕는 툴이다.
 - 테마롤러를 이용해 디자인을 적용하기

============================

 

============================

8.2 제이쿼리에서의 CSS호출
:실시간으로 CSS속성을 위젯에 반영 -> 자바스크립트 또는 제이쿼리에서 적용 가능
============================

 

============================
8.3 translate를 이용한 이동
-css 속성은 실시간으로 움직임을 적용할 수 있또록 지원하고 있음. 이중 translate 속성을 사용하여 해당 엘리먼트를 이동시켜 보기.
대부분의 transform은 1,2,3차원 이동을 지원.

============================

 

============================
8.4 scale를 이용한 확대, 축소
: scale은 크기를 조절할 수 있는 기능. 크기는 각 3개 축 방향 변환 또는 3차원 변환을 지원
============================

 

============================
8.5 skew를 이용한 기울기
: skew는 기울기를 조정할 수 있는 기능. 기울기는 2차원 평면으로 변환할 수 있음.
============================

 

============================
8.6 rotate를 이용한 회전
:rotate는 회전할 수 있는 기능이다. 회전은 축을 중심으로 한 2차원 평면, 3차원 입체까지 회전시킬 수 있음.
===========================

 

============================

CSS의 대상은 <div>태그일 수도 있고, <img>를 가리킬 수도 있음.

[9장. 서버연동]
9.3 Ajax 란?
- Ajax 사용 시, 구조화된 데이터로 사용하면 프로그램은 훨씬 수월하게 되는데, 이러한 구조화된 데이터로 사용하는 형태 중 많이 사용되는 것이 바로
XML과 JSON이다.
 - XML은 '< >' 태그와 '</>' 태그를 이용하여 데이터를 표현한다.
   표현식이 상당히 길어질 수 있다는 단점이 있다.
   데이터를 보다 짧고 간결하게 표현하기 위해 만든 것이 JSON이다. 
 - JSON은 어떠한 객체와 값을 콜론(:)을 기준으로 설정한다. 대괄호, 중괄호로 구분함
   육안으로 구분이 편하고 데이터의 길이도 XML에 비해 짧아졌다.
- 응답 온 JSON 형태의 문자열 데이터를 JSON.parse 메소드를 이용하여 객체를 변환한다.
================================

 

================================= 

9.4 제이쿼리 Ajax사용(JSON & JSONP)
지금까지 자바스크립트에서 Ajax의 데이터 처리에 대해 살펴보았다. 제이쿼리는 더 편한 방법을 제공한다.
-제이쿼리가 서버의 데이터를 가져오기 위한 동작 : $.ajax
-ajax를 호출하여 사용하는 법 이외에 $.getJSON을 이용하여 JSON객체로 바로 사용할 수도 있음.

9.5 그 밖의 서버 연동 방법

-load
-get()
-post()

===============================

 

===============================

====================================================

비디오

 

 

 

==========================