안녕하세요 오늘은 jquery mobile 다운로드 방법을 알려드릴려고합니다.
jquery mobile 웹을 만들수있는 라이브러리 입니다..
jquery mobile 을 이용하면 모바일 홈페이지를 쉽게 만들수 있습니다.
제가 얼마전에 모바일 홈페이지를 만들어볼려고 검색하던준 jquery mobile 이라는것을 알게되었는데
jquery mobile 이용해서 홈페이지를 만들어봤는데 모바일 웹사이트 구축하기 정말 쉽더군요..
jquery mobile 이용해서 홈페이지 만들어보세요.. html 기초만 알고계셔도 모바일홈페이지 만들기는 식은죽먹기입니다.
그리고 php,asp,jsp 중에 하나만 알고 계셔서 로그인 ,회원가입, 게시판 도 만드시면 홈페이지하다가 탄생합니다.
먼저 jquery mobile 로 홈페이지를 만드시려면 html 부터 배우셔야합니다...
jquery mobile.zip
홈페이지에 바로 쓰실려면 위에 압축된 jquery mobile 다운로드 받으셔서 압축푸신후 ftp로 웹서버에 올리시면됩니다.
적용하는방법은 아래 래도 하시면됩니다.
그냥 컴퓨터에서 연습하려면 jquery mobile 폴더로 들어가셔서 html 문서 만들신후에
아래 소스 를 실행시켜보세요... 예제를 첨부합니다. 다운받으셔서 jquery mobile 폴더에 넣은후 실행하세요.
자세한 jquery mobile 사용법은 인터넷 검색하세요.
<!DOCTYPE html>
<html>
<head>
<meta charset="euc-kr" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jquery mobile 테스트 </title>
<link rel="stylesheet" href="jquery mobile/jquery.mobile-1.4.2.min.css">
<script type="text/javascript" src="jquery mobile/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="jquery mobile/jquery.mobile-1.4.2.min.js"></script>
<!-- 홈페이지에 jquery mobile 파일을 올린후 홈페이지 상단에 위에 소스를 넣으주시고면 됩니다. 3줄 -->
</head>
<body>
<div data-role="page" id="first">
<div data-role="header" data-theme=b>
<h1>첫 페이지</h1>
</div>
<div data-role="main" class="ui-content">
<h1>내용1</h1>
<h2>별거없음1</h2>
</div>
<div data-role="footer" data-theme=b>
<h1>끝</h1>
</div>
</div>
</body>
</html>
위와같은 방법으로 하셔서 되고 직접 jquery.com에 등록되어있는 소스를 링크하셔도됩니다.
아래 방법은 jquery mobile 소스를 다운받지않고 jquery.com 에 등록된 소스를 임포트 한것입니다.
아래 와같이 사용하셔도 됩니다. 태그연습장에서 연습할때는 아래 소스로 테스트 하세요..
jquery테스트2.html
<!DOCTYPE html>
<html>
<head>
<meta charset="euc-kr" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jquery mobile 테스트 </title>
<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>
</head>
<body>
<div data-role="page" id="first">
<div data-role="header" data-theme=b>
<h1>첫 페이지</h1>
</div>
<div data-role="main" class="ui-content">
<h1>내용1</h1>
<h2>별거없음1</h2>
</div>
<div data-role="footer" data-theme=b>
<h1>끝</h1>
</div>
</div>
</body>
</html>
최신버전 jquery mobile 다운로드 or CDN 다음을 참조 http://jquerymobile.com/download/
