jQuery を使って動的で高品質なウェブサイトを構築する方法を解説しています。なるべく動くサンプルコードを記載しています。
jQuery 入門jQuery 入門
jQuery の使い方
jQuery の基礎
jQuery モバイル
jQuery UI
サンプルのテーマ変更

jQuery の拡張
関連サイト
サイト情報
ホーム > jQuery UI の利用 > jQuery UI - アイコン

jQuery UI - アイコン

スポンサーリンク

jQuery UI にはフレームワークアイコンとして、 そのテーマにあったアイコンが多数付属します。

jQuery UI のアイコンの使い方とその種類をしめします。

フレームワークアイコンの使い方

アイコンを利用するには、 ui-icon クラスとともに表示したいアイコンのクラスを指定します。 したの print アイコンでは ui-icon-print を指定しています。

アイコンの種類

カラット (carat)
ui-icon-carat-1-neui-icon-carat-1-ne
ui-icon-carat-1-eui-icon-carat-1-se
ui-icon-carat-1-sui-icon-carat-1-sw
ui-icon-carat-1-wui-icon-carat-1-nw
ui-icon-carat-2-n-sui-icon-carat-2-e-w
三角形 (triangle)
ui-icon-triangle-1-nui-icon-triangle-1-ne
ui-icon-triangle-1-eui-icon-triangle-1-se
ui-icon-triangle-1-sui-icon-triangle-1-sw
ui-icon-triangle-1-wui-icon-triangle-1-nw
ui-icon-triangle-2-n-sui-icon-triangle-2-e-w
矢印 (arrow)
ui-icon-arrow-1-nui-icon-arrow-1-ne
ui-icon-arrow-1-eui-icon-arrow-1-se
ui-icon-arrow-1-sui-icon-arrow-1-sw
ui-icon-arrow-1-wui-icon-arrow-1-nw
ui-icon-arrow-2-n-sui-icon-arrow-2-ne-sw
ui-icon-arrow-2-e-wui-icon-arrow-2-se-nw
矢印止め (arrowstop)
ui-icon-arrowstop-1-nui-icon-arrowstop-1-e
ui-icon-arrowstop-1-sui-icon-arrowstop-1-w
太矢印 (arrowthick)
ui-icon-arrowthick-1-nui-icon-arrowthick-1-ne
ui-icon-arrowthick-1-eui-icon-arrowthick-1-se
ui-icon-arrowthick-1-sui-icon-arrowthick-1-sw
ui-icon-arrowthick-1-wui-icon-arrowthick-1-nw
ui-icon-arrowthick-2-n-sui-icon-arrowthick-2-ne-sw
ui-icon-arrowthick-2-e-wui-icon-arrowthick-2-se-nw
太矢印止め (arrowthickstop)
ui-icon-arrowthickstop-1-nui-icon-arrowthickstop-1-e
ui-icon-arrowthickstop-1-sui-icon-arrowthickstop-1-w
戻り矢印 (arrowreturn)
ui-icon-arrowreturn-1-wui-icon-arrowreturn-1-n
ui-icon-arrowreturn-1-eui-icon-arrowreturn-1-s
太戻り矢印 (arrowreturnthick)
ui-icon-arrowreturnthick-1-wui-icon-arrowreturnthick-1-n
ui-icon-arrowreturnthick-1-eui-icon-arrowreturnthick-1-s
更新矢印 (arrowrefresh)
ui-icon-arrowrefresh-1-wui-icon-arrowrefresh-1-n
ui-icon-arrowrefresh-1-eui-icon-arrowrefresh-1-s
四方矢印 (arrow-4)
ui-icon-arrow-4ui-icon-arrow-4-diag
バッテリー (battery)
ui-icon-battery-0ui-icon-battery-1
ui-icon-battery-2ui-icon-battery-3
円 (circle-4)
ui-icon-circle-plusui-icon-circle-minus
ui-icon-circle-closeui-icon-circle-triangle-e
ui-icon-circle-triangle-sui-icon-circle-triangle-w
ui-icon-circle-triangle-nui-icon-circle-arrow-e
ui-icon-circle-arrow-sui-icon-circle-arrow-w
ui-icon-circle-arrow-nui-icon-circle-zoomin
ui-icon-circle-zoomoutui-icon-circle-check
ui-icon-circlesmall-plusui-icon-circlesmall-minus
ui-icon-circlesmall-close
四角 (square)
ui-icon-squaresmall-minusui-icon-squaresmall-close
ui-icon-squaresmall-plus
グリップ (grip)
ui-icon-grip-dotted-verticalui-icon-grip-dotted-horizontal
ui-icon-grip-solid-verticalui-icon-grip-solid-horizontal
ui-icon-gripsmall-diagonal-seui-icon-grip-diagonal-se
転送 (transfer)
ui-icon-transferthick-e-wui-icon-folder-collapsed
ui-icon-transfer-e-w
ドキュメント (document)
ui-icon-documentui-icon-document-b
メール (mail)
ui-icon-mail-closedui-icon-mail-open
ズーム (zoom)
ui-icon-zoominui-icon-zoomout
ラジオボタン (radio)
ui-icon-radio-offui-icon-radio-on
ピン (pin)
ui-icon-pin-wui-icon-pin-s
メディア再生関連
ui-icon-playui-icon-pause
ui-icon-seek-nextui-icon-seek-prev
ui-icon-seek-endui-icon-seek-start
ui-icon-stopui-icon-eject
ui-icon-volume-offui-icon-volume-on
プラスとマイナス
ui-icon-plusui-icon-plusthick
ui-icon-minusui-icon-minusthick
閉じる (close)
ui-icon-closeui-icon-closethick
メッセージ
ui-icon-alertui-icon-info
ui-icon-noticeui-icon-help
ui-icon-check
シグナル
ui-icon-signal-diagui-icon-signal
その他各種アイコン
ui-icon-extlink外部リンク
ui-icon-newwin新しいウィンドウ
ui-icon-refresh更新
ui-icon-shuffleシャッフル
ui-icon-folder-openフォルダーを開く
ui-icon-noteメモ
ui-icon-suitcaseスーツケース
ui-icon-commentコメント
ui-icon-person
ui-icon-print印刷
ui-icon-trashごみ
ui-icon-locked施錠 - ロック
ui-icon-unlocked解錠 - アンロック
ui-icon-bookmarkお気に入り、ブックマーク
ui-icon-tagタグ
ui-icon-homeホーム
ui-icon-flagフラグ
ui-icon-calendarカレンダー
ui-icon-cartカート
ui-icon-pencil鉛筆
ui-icon-clock時計
ui-icon-diskディスク
ui-icon-calculator計算機
ui-icon-search検索
ui-icon-wrenchレンチ
ui-icon-gearギア、歯車
ui-icon-heartハート
ui-icon-star星、スター
ui-icon-linkリンク
ui-icon-cancelキャンセル
ui-icon-keyキー、鍵
ui-icon-lightbulb電球
ui-icon-scissorsはさみ
ui-icon-clipboardクリップボード
ui-icon-copyコピー
ui-icon-contact連絡先、コンタクト
ui-icon-image画像
ui-icon-videoビデオ
ui-icon-scriptスクリプト
ui-icon-bullet中黒、ビュレット
ui-icon-power電源
スポンサーリンク
ホーム > jQuery UI の利用 > jQuery UI - アイコン
小山圭介 著者
小山 圭介
4/15/1973生
米国在住のソフトウェアエンジニア。ITコンサルタント.. »プロフィール
スポンサーリンク

© 2011-2013 Keisuke Oyama jQuery 入門