나름 간단한 리스트 메뉴를 만들었습니다. 아이폰에서도 잘 됩니다.
Jquerymobile.com 여기 사이트 자료 많네요.
제가 평상시 생각하는 에러를 쉽게 검색할 수 있다면 좋겠죠.
나름 한번 만들어 볼려고 했습니다.
아이폰에서도 잘 되더군요. 아직 메뉴만 만들었으니.. 기대는 마시구요.
해드 부분 설명
<!DOCTYPE html> ß HTML5 선언 태그 입니다.
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type">
ß 한글 표현을 위해 charset 지정을 utf-8로 선언
<title>마이크로소프트 에러 검색</title>
<link rel="stylesheet" href="jquery.mobile-1.0a4.1.min.css" />
<script src="jquery-1.5.2.min.js"></script>
<script src="jquery.mobile-1.0a4.1.min.js"></script>
ß 위에 3줄 JQuerymobile을 위한 스크립트 선언.
http://jquerymobile.com/blog/2011/04/07/jquery-alpha-4-1-maintenance-release/
여기 사이트에 가시면 최신 링크를 다운 받을 수 있습니다.
</head>
바디부분 설명
하나의 html 문에 여러 개의 페이지를 구성하여 각 구성된 페이지에 연결 및 뒤로 가기가 가능하게 구성 함.
<body>
<div data-role="page" data-theme="b">
ß JQuerymobile 테마 변경 기본테마는 a형으로 검정색이어서 파랑색 테마로 변경 함.
테마 설명을 jquerymobile.com 사이트를 참고
ß 각 페이지는 Header, Content, Footer 3부분으로 구성 함.
|
|
header |
|
|
content |
|
|
footer |
<div data-role="header">
<h3>Microsoft Error Search</h3>
</div>
<div data-role="content">
<ul data-role="listview">
<li><a href="#eventlog">이벤트 로그 검색</a></li>
<li><a href="#update">업데이트 오류 검색</a></li>
<li><a href="#smtp">SMTP 오류 검색</a></li>
<li><a href="#outlook">Outlook 오류 검색</a></li>
<li><a href="#rbl">RBL 체크</a></li>
</ul>
</div>
ß content는 리스트 메뉴로 구성하며 링크페이지를 별도의 페이지를 만들지
않고 하나의 페이지에 #으로 각 페이지를 지정하여 링크 선언을 함.
<div data-rile="footer">
<hr>
<p><center>글로벌소프트 이완주</center></p>
</div>
</div>
<div data-role="page" id="eventlog" data-theme="b">
ß 페이지 id를 eventlog로 선언, 테마는 b형 선택
자동으로 알아서 back 메뉴는 만들어 주네요.
Jquerymobile 사이트에서 image 파일 다운 받아서 해당 사이트에 복사 해 주셔야 이미지 정상적으로 나옵니다.
댓글