jQuery Mobile リファレンス

Tweet

リスト内でclass=”ui-li-count”を付けた要素でカウントバブルを作成することができます。

カウントバブルはdata-role=”listview”で作成したリストではclass=”ui-li-count”を付けた要素を配置することで表示可能です。

<ul data-role="listview">
	<li><a href="acura.html">Acura<span class="ui-li-count">5</span></a></li>
	<li><a href="audi.html">Audi<span class="ui-li-count">5</span></a></li>
	<li><a href="bmw.html">BMW<span class="ui-li-count">5</span></a></li>
</ul>

sample

カウントバブルのテーマはdata-count-theme属性で変更可能です。

jQuery Mobile 1.3以前ではカウントバブルのデフォルトのテーマは「C」でしたが、jQuery Mobile 1.4より親要素のテーマを継承するになり形状も変更されました。

sample

登録日 : 2012年11月23日 最終更新日 : 2016年12月19日

同じカテゴリー(リスト)のエントリー

• data-filter-reveal
• data-filtertext
• data-filter-placeholder
• data-filter
• class=”ui-li-count”
• data-autodividers
• data-split-icon
• data-inset=”true”