Split Button
리스트 아이템에 개별적으로 두 가지 action을 부여하려면 Split Button 을 이용하면 된다.
Split Button 은 리스트의 오른쪽 가장자리에 위치한 아이콘 영역이다.
<li> Tag 내부에 링크를 하나 더 추가하면 전자정부 모바일 표준프레임워크가 자동으로 Split Button 을 생성한다.
아이콘 이름을 data-split-icon 속성 값으로 적용하면 원하는 아이콘을 Split Button에 삽입할 수 있다.
Split Button의 색상은 data-split-theme 속성에 해당 테마를 적용하여 변경할 수 있다.
- <ul data-role="listview" data-inset="true" data-split-icon="gear">
- <li data-role="list-divider">Coffee</li>
- <li><a href="#">Americano</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li><a href="#">Caffe Latte</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li data-role="list-divider">Icecream</li>
- <li><a href="#">Vanilla</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li><a href="#">Yogurt</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li><a href="#">Strawberry</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li><a href="#">Fashion fruit</a><a href="/guide/components/list/format.do">Detail</a></li>
- <li><a href="#">Chocolate</a><a href="/guide/components/list/format.do">Detail</a></li>
- </ul>