jQueryのモバイルボタンアイコン

jQueryのモバイルは、より望ましいのアイコンを見ることができますボタンのセットを提供します。

jQueryのモバイルにアイコンを追加するためのボタン

私たちは、ボタンにアイコンを追加するクラスのUI-アイコンを使用することができ、そしてボタンが指定されたクラスを使用して設定することができます。

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">Search</a>

注：このようなリストやボタンの形など、他の方法でボタン、上のデータ-icon属性を利用します。次のセクションでは、特定紹介します。

我々はjQueryのモバイルが提供する利用可能なアイコンのいくつかをリストの下に：

Buttonクラス	説明	例
UI-アイコン矢印-リットル	左矢印	試します
UI-アイコン矢印-R	右矢印	試します
UI-アイコン-情報	情報	試します
UI-アイコンを削除	削除	試します
UI-アイコンバック	後退	試します
UI-アイコンオーディオ	スピーカー	試します
UI-アイコンロック	南京錠	試します
UI-アイコン検索	検索	試します
UI-アイコンアラート	警告	試します
UI-アイコングリッド	メッシュ	試します
UI-アイコン - ホーム	ホーム	試します

すべてのボタンアイコンのjQuery Mobileの完全なリファレンスマニュアルについては、私たちの訪問jQueryのモバイルアイコンのリファレンスマニュアルを。

場所アイコン

トップ（上）、右側（右）、ボトム（底）で、左（左）：あなたはまた、どの位置のボタンに位置し、アイコンを指定することができます。

場所を指定するには、UI-BTN-icon属性を使用してください：

アイコン場所：

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-top">トップ</a>の
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-right">右側します</a>
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-bottom">底します</a>
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">左側します</a>

»をお試しください

	あなたはボタン画像の場所を指定しない場合、アイコンは表示されません。

アイコンだけを表示します

あなたはアイコンを表示したい場合は、「notext」を使用することができます。

例：

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-notext">検索します</a>

»をお試しください

サークルを削除します

デフォルトでは、すべてのアイコンは灰色の円を持っています。あなたがそれを必要としない場合は、要素の「UI-nodisc-アイコン」カテゴリを使用することができます。

例

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">使用円（デフォルト）します</a>
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left ui-nodisc-icon">円を削除します</a>

»をお試しください

黒、白のボタン

デフォルトでは、すべてのアイコンは白です。あなたはアイコンの色が黒である変更する必要がある場合は、「UI-ALT-アイコン」の要素に追加できます。

例

<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left">白</a>の
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-left ui-alt-icon">ブラック</a>の

»をお試しください