jQuery UI の導入方法についての記事。
jQuery UI とは、jQuery公式のユーザインターフェース（UI）用ライブラリのこと。
jQuery UI を使うと、UIを駆使した、高度なインターネットアプリケーションを作ることができる。CSS テーマなどもあらかじめ用意されているので、特別なことをしなくても、ある程度のことは出来てしまう優れものだ。
導入
jQuery UI – Configure your downloadより、最新バージョンをダウンロード。2011/05/16現在の最新バージョンは、1.8.12なので、「jquery-ui-1.8.12.custom.zip」ファイルをダウンロード。
使いたい js ファイルや css ファイルを、自分のサイトのサーバーにアップロードし、使いたいページで読み込む。大概の js ファイルは、「development-bundle/ui/」に入っている。css ファイルは、「development-bundle/themes/」に入っている。それぞれのプラグインは、依存関係がある場合があるので、読み込む順番にも、注意が必要だ。
依存関係が面倒な場合は、「 jquery-ui-1.8.12.custom.min.js 」を、まるごと読み込んでしまおう。
もちろん、jQuery を読み込んでおく必要もある。
まるごと読み込む例
<link rel="stylesheet" href="themes/base/jquery.ui.all.css">
<script type="text/javascript" src="ui/jquery-ui-1.8.12.custom.min.js"></script>
<script type="text/javascript" src="ui/jquery-ui-1.8.12.custom.min.js"></script>
ファイルへのパスは、それぞれ、アップロードした場所を指定する。
プラグイン別に読み込む例
例えば、jQuery UI の Accordion プラグインを読み込むなら、
<link rel="stylesheet" href="themes/base/jquery.ui.all.css">
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="ui/jquery.ui.accordion.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="ui/jquery.ui.core.js"></script>
<script type="text/javascript" src="ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="ui/jquery.ui.accordion.js"></script>
となる。ファイルへのパスは、それぞれ、アップロードした場所を指定する。