jQuery 모바일 theme 적용방법
페이지 정보
작성자 서방님 댓글 0건 조회 141회 작성일 15-07-15 13:48본문
<link rel=”stylesheet” href="”lucker.css” />
<link rel=”stylesheet” href="”jquery.mobile.icons.min.css” />
<link rel=”stylesheet” href="”jquery.mobile.structure-1.4.0.css”>
<script src="”jquery-1.10.2.js”></script>
<script src="”jquery.mobile-1.4.0.js”></script>
import>Import Default Theme 선택후 >import
2. 테마 추가후 다운로드 후에 위와 같이 넣어주면 된다.
->더이상 a~g까지 지원하던 테마는 클래식으로 되었고
이제는 a~b만 지원되기에 위와같이 커스텀으로 제작
제이쿼리 모바일 페이지의 3가지 방법
- jQuery Mobile(CDN): CDN이란 Content Delivery Network의 줄임말로 페이지 제작을 위해 필요한 외부파일들을 사용자 컴퓨터에 저장하지 않고 jQuery 서버에서 링크해 사용하는 것으로 한번 파일이 전송되면 스마트폰 단말에 캐시되어 남아 있고 다른 앱에서 사용했다면 그만큼 속도가 더 빨라 질 수도 있고 버전업그레이드 시에 내 파일도 자동으로 바뀌므로 신경쓰지 않아도 되나 CSS파일을 수정할 수 없다.
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js"></script>
- jQuery Mobile(Local): 웹 문서 제작에 필요한 css파일과 js파일을 사용자 컴퓨터에 저장하는 방식이나 테마를 함께 사용 못한다.
<link rel="stylesheet" href="jquery.mobile-1.4.0.min.css" />
<script src="jquery-1.9.1.min.js"></script>
<script src="jquery.mobile-1.4.0.min.js"></script>
- jQuery Mobile with theme(Local): 가장 편리한 방식으로 테마를 함께 사용할 수 있다. CSS파일을 2개로 나누어 하나는 사이트 구조 CSS(jquery.mobile.structure-1.0.css)로 사용하고, 다른하나는 사이트의 스타일을 만드는 CSS파일(jquery.mobile.theme-1.0.css로 사용한다. 사이트의 스타일을 만드는 CSS파일에서는 글꼴이나 색상 등의 스타일 정보가 들어 있기 때문에 이 CSS파일을 수정하면 모바일 웹 앱을 사용자가 원하는 스타일로 수정할 수 있다.
<link href="jquery.mobile.theme-1.0.css rel="stylesheet"><link href="jquery.mobile.structure-1.0.css rel="stylesheet"> <script src="jquery-1.6.4.js" ></script> <script src="jquery.mobile-1.0.js" ></script>
data-theme ="a~g" 적용 버전 <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" /> <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script> <script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
또는 <link rel=”stylesheet” href="”theme-classic.css”> 테마 클래식을 사용하면 된다. 2014년 현재 예전 태마 data-theme=”c~g”는 빠져있다.
댓글목록
등록된 댓글이 없습니다.