jQuery UI
出典: フリー百科事典『ウィキペディア（Wikipedia）』 (2023/02/15 08:36 UTC 版)
| 開発元 | The jQuery Project |
|---|---|
| 最新版 |
1.13.0
/ 2021年10月7日[1] |
| 最新評価版 |
1.13.0-rc.3
/ 2021年9月25日[2] |
| リポジトリ | |
| プログラミング 言語 | JavaScript |
| サポート状況 | Active |
| 種別 | Webアプリケーションフレームワーク プラグイン |
| ライセンス | MIT |
| 公式サイト |
jqueryui |
jQuery UI はインタラクティブなWebサイトを開発するために使用される、jQueryをベースにしたJavaScriptのライブラリである。マウスベースのインタラクションやアニメーション、テーマを適用可能なDialogやDatepickerといったウィジェットが提供される。2007年9月に jquery.com 上にあるJohn Resigのブログ[3]にてリリースが発表された。2021年10月、メンテナンスモードへ移行が発表された[4]。
なお、jQuery UIは MIT License[5]であり、フリーかつオープンソースである。
概要
jQuery UI は以下に示す機能が提供されており、これらは機能ごとに分割してダウンロードする事ができる。これによりファイル サイズの削減が行うことができ、サードパーティがテーマを提供することも可能にする。例えば jQUIT Builder では Windows 8 Style UIを模した[6]テーマを提供している。
インタラクション
マウスベースの対話性を実現するために使用される。
- Draggable - 各要素に対するドラッグ機能を実現する。
- Droppable - ドラッグと共に使用され要素のドロップをできるようにする。
- Resizable - 要素のリサイズを実現する。
- Selectable - 複数要素を選択できるようにする。
- Sortable - 要素のソートを行えるようにする。
ウィジェット
ウィジェットはWebサイト利用者が目に触れるコントロールである。全てのウィジェットはテーマを提供することができる。
- Accordion - アコーディオン コンテナである。
- Autocomplete - ユーザの入力に応じ候補を表示する。Menuウィジェットと共に使用する。
- Button - チェック ボックスやラジオ ボタンを含めたボタンを提供する。
- Datepicker - 日付を選択する事ができるカレンダーであり テキストボックス等に値を戻すことができる。
- Dialog - タイトルバーとコンテンツエリア、ボタンから構成されるダイアログボックスを提供する。Buttonウィジェットと共に使用する。
- Menu - ネストされたメニューを提供する。
- Progressbar - 処理の進捗状態を表示するために使用する。
- Slider - 指定した範囲の値を取得できる。
- Spinner - 数値の上下を入力するために使用する。Buttonウィジェットと共に使用する。
- Tabs - ブラウザのタブなどにみられるようなタブを要素に追加する。Buttonウィジェットと共に使用する。
- Tooltip - ツールチップを表示する。
エフェクト
jQueryで提供されるEffectsの上位機能である。要素が表示される際にアニメーション効果が定義されている。
- Color Animation - ある色から別の色に変化させる。
- Toggle Class, Add Class, Remove Class, Switch Class - スタイルを別のスタイルに変化させる。
- Effect - さまざまなエフェクトを定義する(Blind, Fade, Slide等)。
- Toggle - エフェクトの実行を切り替える。
- Hide, Show - 以上のエフェクト使用する。
ユーティリティ
- Position - ある要素の位置に対し相対的な位置を決定する。
サンプル
<script type="text/javascript">
// #draggableをドラッグできるようにする。
$(function () {
$("#draggable").draggable();
});
</script>
<div id="draggable" style = "width: 150px; height: 150px; padding: 0.5em;" class="ui-widget-content">
<p>ドラッグしてください</p>
</div>
"draggable"をIDに持つ、divのドラッグ操作をできるようにする。
リリース履歴
jQuery UI は2007年9月17日にリリースされた。[3]
| リリース日[7] | バージョン番号 | jQuery バージョン番号 | 備考 |
|---|---|---|---|
| 初回リリース[3] | |||
| 2008年6月8日 | 1.5 | ||
| 2009年4月16日 | 1.6 | 1.2.6 | |
| 2009年3月3日 | 1.7 | 1.3.2+ | |
| 2010年3月18日 | 1.8 | 1.3.2+ | |
| 2011年1月19日 | 1.8.9 | 1.3.2+ | |
| 2011年2月22日 | 1.8.10 | 1.3.2+ | |
| 2011年3月15日 | 1.8.11 | 1.3.2+ | |
| 2011年4月13日 | 1.8.12 | 1.3.2+ | |
| 2011年5月12日 | 1.8.13 | 1.3.2+ | |
| 2011年6月17日 | 1.8.14 | 1.3.2+ | |
| 2011年8月1日 | 1.8.15 | 1.3.2+ | |
| 2011年8月15日 | 1.8.16 | 1.3.2+ | |
| 2012年1月10日 | 1.8.17 | 1.3.2+ | |
| 2012年2月20日 | 1.8.18 | 1.3.2+ | |
| 2012年4月16日 | 1.8.19 | 1.3.2+ | |
| 2012年4月30日 | 1.8.20 | 1.3.2+ | |
| 2012年6月5日 | 1.8.21 | 1.3.2+ | |
| 2012年7月24日 | 1.8.22 | 1.3.2+ | |
| 2012年8月15日 | 1.8.23 | 1.3.2+ | |
| 2012年9月28日 | 1.8.24 | 1.3.2+ | |
| 2012年10月08日 | 1.9.0 | 1.6+ | |
| 2012年10月25日 | 1.9.1 | 1.6+ | |
| 2012年11月23日 | 1.9.2 | 1.6+ | |
| 2014年1月17日 | 1.10.4 | 1.6+ | |
| 2021年10月7日 | 1.13.0 | 1.8+ | |
| 2022年7月14日 | 1.13.2 | 1.8+ |
関連項目
- jQuery
- jQuery mobile - モバイル端末向けに提供されている。
- QUnit - The jQuery Projectが提供している、JavaScript向けの単体テストツールである。
脚注・出典
- ^ “jQuery UI 1.13.0 Changelog” (2021年10月7日). 2021年10月14日閲覧。
- ^ “jQuery UI 1.13.0-rc.3 released” (2021年9月25日). 2021年10月4日閲覧。
- ^ a b c John Resig (2007年9月17日). “jQuery UI: Interractions and plug-ins”. jQuery blog. 2012年11月17日閲覧。
- ^ “jQuery UIとjQuery Mobileがついに開発終了、今後はメンテナンスのみに。jQuery本体は引き続き積極的に開発” (2021年10月12日). 2022年2月10日閲覧。
- ^ Dave Methvin (2012年9月10日). “jQuery Licensing Changes”. jQuery blog. 2016年8月18日閲覧。
- ^ “jQUIT(jQuery UI Themes)”. Thomas Ingwersen. 2012年11月17日閲覧。
- ^ “jQuery UI - Documentation: UIChangelog”. 2012年11月17日閲覧。
参考文献
- Sarrion, Eric (March 24, 2012). jQuery UI (1st ed.). O'Reilly Media. p. 244. ISBN 978-1449316990
- Wellman, Dan (August 23, 2011). jQuery UI 1.8: The User Interface Library for jQuery (1st ed.). Packt Publishing. p. 424. ISBN 978-1849516525
- de Jonge, Adriaan, Dutson, Phillip (November 2, 2012). jQuery, jQuery UI, and jQuery Mobile: Recipes and Examples (1st ed.). Addison-Wesley Professional. p. 400. ISBN 978-0-321-82208-6
外部リンク
| 低レベル |
| ||||||||||||||||||||||||||||||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 高レベル |
| ||||||||||||||||||||||||||||||||||||||||
| |||||||||||||||||||||||||||||||||||||||||
「JQuery UI」の例文・使い方・用例・文例
- JQuery_UIのページへのリンク
