ボタンのテーマ設定
jQuery Mobileは、ボタンのスタイルも自由に変更できるリッチな テーマ システムを備えています。リンクをコンテナに入れた場合、ボタンはカメレオンのように自動的に親要素のスウォッチにしたがいます。ボタンがスウォッチ “a” のコンテナに入っている場合、そのボタンもまた “a” のスタイルで設定されます。次に示すのは、デフォルトテーマのスウォッチセットです。
A swatch
ButtonB swatch
ButtonC swatch
ButtonD swatch
ButtonE swatch
Buttonテーマスウォッチの設定
ボタンは手動で任意の data-theme を設定することで、コンテナとは異なったスウォッチにすることも出来ます。
Theme a
下の5つのアイコン付きボタンは data-theme 属性の指定により異なったスウォッチを設定したものです。
Theme a Theme b Theme c Theme d Theme e
テーマのバリエーション
“a” theme on container with themed buttons inside
Theme a Theme b Theme c Theme d Theme e
“b” theme on container with themed buttons inside
Theme a Theme b Theme c Theme d Theme e
“c” theme on container with themed buttons inside
Theme a Theme b Theme c Theme d Theme e
“d” theme on container with themed buttons inside
Theme a Theme b Theme c Theme d Theme e
“e” theme on container with themed buttons inside
Theme a Theme b Theme c Theme d Theme e