jQuery UI
最終更新日時:2017-03-30 17:34:06
jQuery
jQuery
jQuery UIは、jQuery の UI 部分を拡張するライブラリです。
一から実装するとかなり大変な機能が提供され、とても簡単に使えますので、jQuery UI が提供している中で使いたい機能があれば、積極的に使用することをおすすめします。
公式サイトは以下になります。
http://jqueryui.com/
使用方法
jQuery UI は、動作に必要な JS ファイルや CSS ファイルを CDN (Content Delivery Network) で提供しています。
以下のように外部 URL を指定するだけで必要なファイルの読み込みは完了となりますので、とてもお手軽です。
<script type="text/javascript" src="https://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script> <link type="text/css" rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/cupertino/jquery-ui.min.css" />
もちろん、上記に相当するファイルを実際にダウンロードして使用してもOKです。
ダウンロードは以下から出来ます。
http://jqueryui.com/download/
あとはそれぞれの UI ウィジェットの使用方法に従って HTML/JS/CSS を作成することになるので、それぞれのウィジェットの使用法を参照ください。
テーマ
jQuery UI にはテーマという概念があります。
テーマにより、jQuery UI で提供しているウィジェットの共通のスタイルを定義することが出来ます。
テーマは用意されている物だけでも25種類(テーマ無し+24種類)ありますが、さらに独自にカスタマイズすることも出来ます。
そのためのサイトが以下です。
http://jqueryui.com/themeroller/
このサイトでテーマの選択およびカスタマイズを行い、その結果をダウンロードすることが出来ます。
※テーマの選択だけであれば CDN の読み込みで実現できます。