jQuery UIとは
jQuery UIとは、jQueryを拡張するライブラリの一種で、ユーザーインターフェースに関わる機能を提供する。
具体的には、Interactions(マウス操作による対話操作)、Widgets(高機能なUI部品)、Effects(標準アニメーションの拡張)といった機能を提供している。
| 分類 | 機能名 | 概要 |
|---|---|---|
| Interactions | Draggable | マウスのドラッグ操作で要素をドラッグできるようにする |
| Droppable | マウスのドラッグ操作で要素をドロップできるようにする | |
| Resizable | マウスのドラッグ操作で要素のサイズを変更できるようにする | |
| Selectable | マウスクリックで要素の選択状態を表現できるようにする | |
| Sortable | 要素の並べ替えを可能にする | |
| Widgets | Accordion | アコーディオンパネル |
| Autocomplete | オートコンプリート機能 | |
| Button | ボタン | |
| Datepicker | 日付入力ボックス | |
| Dialog | ダイアログ | |
| Menu | 展開可能なメニュー | |
| Progressbar | 進捗ばー | |
| Slider | スライダー | |
| Spinner | スピナー | |
| Tabs | タブパネル | |
| Tooltip | ツールチップ | |
| Effects | Effect | 要素の基本的なアニメーションを提供 |
| Color Animation | 色を徐々に変化させるアニメーション | |
| Toggle Class/ Add Class / Remove Class / Switch Class | CSSクラスの適用/解除にアニメーションを適用 | |
| Toggle / Hide Show | 要素の表示/非表示にアニメーションを適用 |
デモサイト
Datepikcerのサンプル
<form>
日付:<input type="text" id="date" />
</form>
$(function () {
$("#date").datepicker($.datepicker.regional["ja"]);
});
See the Pen
jQuery22-1 by shinjiezumi (@sezumi)
on CodePen.
