오......그냥 앱웹을 검색하다가 결국 jqtouch 까지 오게되었다.
(폴더 jqtouch 가 보인다!)
스크립트도 사용할줄 모르는 놈에게 jquery 라니...-0- 험난한 길이 뻔히 보인다.
먼저 설정부터 시작!
1. css,js 파일이 있는 패키지를 다운 받는다!
2. 압축을 풀면 폴더가 생기는데 그 폴더안에 필요한 파일이 다 들어가 있다.
우선 폴더 이름을 깔끔하게 jqtouch 로 하고 해당하는 이클립스에 복사해 두었다.
3. 이제 스크립트 소스 링크만 해주면 맘껏 사용해줄수 있다.
<%@page contentType="text/html" pageEncoding="euc-kr"%><!DOCTYPE HTML>
<html><head><meta http-equiv="Content-Type" content="text/html; charset=euc-kr"><title>jQTouchTest</title><script src="jqtouch/jqtouch/jquery.1.3.2.min.js"></script><script src="jqtouch/jqtouch/jqtouch.min.js"></script><style type="text/css">@import "jqtouch/jqtouch/jqtouch.min.css";</style><style type="text/css">@import "jqtouch/themes/jqt/theme.min.css";</style><script>$.jQTouch();</script></head><body><div id="home"><div class="toolbar"><h1>jQTouchTest</h1></div><ul class="rounded"><li><a href="#samsung">삼성</a></li><li><a href="#apple">애플</a></li><li><a href="#chick">닭공장</a></li><li><a href="#google">구글</a></li></ul></div></body></html>
(혹시 폴더 이름이 다르게 되어 있다면 src 부분을 고쳐서 쓰면 된다.)
4. 마지막! 실행화면! 링크 : http://www.testiphone.com/ 여기에 자신이 만든 주소만 넣어주면 실제 화면처럼 나온다.(뭐 화면만 줄여서 출력하는 정도이지만 우리가 원하는건 UI 이기 때문에 이것만으로도 만족한다.)
데모 싸이트가 있기 때문에 쉽게 따라할수 있을거 같다.(나는 동적인것을 사용하는게 아닌-영상이나,다이렉티브한것말고 UI를 사용할려고 한것이기 때문에 데모만으로도 충분할꺼 같다.)
'web > JQTouch' 카테고리의 다른 글
| jQTouch 페이지 전환 효과! (0) | 2010.12.07 |
|---|---|
| jQTouch viewport 에 대하여.. (0) | 2010.12.06 |
| jQTouch 혹시 한글이 안된다면! (2) | 2010.12.05 |
| jQTouch media Queries (0) | 2010.12.02 |
| jQTouch 화면전환 애니메이션. (0) | 2010.11.30 |
