NEW 
スキルアップ
2022.09.22
【2022年9月版】無料で学べるプログラミングの学習サイト！おすすめ22選
jQuery
2018.07.23
jQuery UI を利用する際に 重要な役割を担うのが widget（ ウィジェット ）です。
今回は、jQuery UI の widget についてまとめて解説いたします。
jQuery UI の widget（ ウィジェット ）は、ダイアログ等のコントロールを作成するために予め用意されているキットのようなイメージです。
widget の他にも、jQuery UI で予め用意されているものに interactions（ インタラクション ）や effects（ エフェクト ）があります。
| interactions（ インタラクション ） |
|---|
|
マウスベースの対話性を実現
・draggable：要素のドラッグ機能を実現 |
| effects（ エフェクト ） |
|
アニメーション効果が定義される等 jQuery で提供される effects 機能の上位機能を提供
・color animation：色を変化させる |
| widget（ ウィジェット ） |
|
コントロールを作成
・accordion |
主な widget は以下の通りです。
サンプルのコード等については、表中の各 widget 名をクリックして遷移先のページをご参照下さい。
| accordion |
| 必要に応じてコンテンツを開閉する widget
ヘッダー１
コンテンツの内容１
コンテンツの内容２ コンテンツの内容３ ヘッダー２
コンテンツの内容１
コンテンツの内容２ コンテンツの内容３ ヘッダー３
コンテンツの内容１
コンテンツの内容２ コンテンツの内容３
|
| autocomplete |
| 入力候補リストを表示して入力を補助する widget
星座名の中の一文字をひらがなで入力して下さい！
|
| button |
| 色々な HTML 要素に対してボタンを生成する widget
|
| datepicker |
| カレンダーを表示する widget
|
| dialog |
| メッセージ等を表示するダイアログを作成する widget
|
| menu |
| 階層メニューを作成する widget
|
| progressbar |
| 進捗状況等を表示するプログレスバーを作成する widget
|
| slider |
| スライダーを作成する widget
|
| spinner |
| スピナー（ 数値を増減させるための上下ボタン ）を作成する widget
|
| tabs |
| 折りたたみ機能等を持つタグを作成する widget
|
| tooltip |
| ツールチップ（ 吹き出し ）を作成する widget
|
jQuery UI の widget まとめについて、いかがでしたでしょうか。
「Webプログラマになりたいけど、独力では限界がある」と感じている方には、「プログラマカレッジ」がおすすめです。
「プログラマカレッジ」は本気でプログラマを目指す方のための、就職支援付き、受講料無料のプログラミングスクールです。
今回ご紹介した「jQuery」を含む豊富なカリキュラムで、IT初心者からWebプログラマとして就職するまで、プロが完全にサポートします。
本気でプログラマとして就職・転職したいという方は、一度のぞいてみてはいかがでしょうか。
スキルアップ
2022.09.22
スキルアップ
2022.09.21
スキルアップ
2022.09.20
スキルアップ
2022.09.16
スキルアップ
2022.09.06
スキルアップ
2022.09.06
INTERNOUS,inc. All rights reserved.
