2011년 8월 12일 금요일

jQuery Mobile - Navigation Bars


Navigation Bars

<div data-role="page" id="page1">
<div data-role="header">
<h1>Notification Detail</h1>
<nav data-role="navbar">
<a href="#" class="ui-btn-active">First</a>
<a href="#">Second</a>
<a href="#">Third</a>
<a href="#">Fourth</a>
<a href="#">Fifth</a>
</nav>
</div>
<div data-role="content">
<h3>Nested List Example</h3>

</div>
<div data-role="footer">
<h1>O'Relly</h1>
</div>
</div>

<ul> 태그를 폭을 정당히 분할 하여 보다 깔금하게 보이게 할수 있다.
<nav data-role="navbar">
<ul>
<li><a href="#" class="ui-btn-active">First</a></li>
<li><a href="#">Second</a></li>
<li><a href="#">Third</a></li>
<li><a href="#">Fourth</a></li>
<li><a href="#">Fifth</a></li>
</ul>
</nav>


Positioning the Header and Footer
Header와 Footer 위치를 지정하는 3가지 방법이 있다.
  • Standard: 디폴트
  • Fixed: Scroll이 될 때도 Header와Footer는 항상 보인다.
  • Fullscreen: Standard와 차이점을 잘 모르겠다.


<div data-role="header" data-position="fullscreen">
<div data-role="footer"  data-position="fixed">

댓글 없음:

댓글 쓰기

블록체인 개요 및 오픈소스 동향

블록체인(block chain) 블록체인은 공공 거래장부이며 가상 화폐로 거래할때 발생할때 발생할 수 있는 해킹을 막는 기술. 분산 데이터베이스의 한 형태로, 지속적으로 성장하는 데이터 기록 리스트로서 분산 노드의 운영자에 의한 임의 조작이 불가...