data-divider-theme

このエントリーをはてなブックマークに追加

data-divider-themeはリストの見出しのテーマを変更する属性です。

リストはdata-role=”listview”を利用し作成し、見出しはdata-role=”list-divider”で設定します。

リストのul/ol要素にdata-divider-themeで見出しで利用するテーマが設定可能です。

<ul data-role="listview"　data-divider-theme="b">
	<li data-role="list-divider">見出し</li>
	<li><a href="acura.html">Acura</a></li>
	<li data-role="list-divider">見出し</li>
	<li><a href="audi.html">Audi</a></li>
	<li><a href="bmw.html">BMW</a></li>
</ul>

sample

カスタムメニューのテーマ

jQuery Mobile 1.3.0よりdata-native-menu=”false”を指定したカスタムメニューのoptgroupの見出しのテーマをdata-divider-themeで変更できるようになりました。

<select data-native-menu="false" data-divider-theme="e">
	<optgroup label="title1">
		<option value="menu1">menu1</option>
		<option value="menu2">menu2</option>
		<option value="menu3">menu3</option>
	<optgroup>
	<optgroup label="title2">
		<option value="menu1">menu1</option>
		<option value="menu2">menu2</option>
		<option value="menu3">menu3</option>
	<optgroup>
</select>

sample

jQuery Mobile 1.3.0での追加/変更

jQuery Mobile 1.3.0よりカスタムメニューのテーマ変更にも対応いたしました。

参考URL

jQuery Mobile Docs - List Dividers

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

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

検索

スポンサードリンク

バージョン

リファレンス