[Google Libraries API]jQueryUIをロード

googel CDNを使ったjQueryのロードに引き続き、今度は、jQueryUIのインクルードの方法について。

下のように一発かませばおｋ

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" ></script>

ただし、これだけだとまだ不十分で、jQueryUIでは、CSSが必要。

jQueryUIのサイトのdownloadページにいけば、CSSのダウンロードをすることができるのですが、それは、めんどい。
だって、jsは、CDNをつかっているのに、CSSは違うサーバーなんて！！

どうせならCSSもCDN経由で使いたい。
何か方法ないかなーっと思っていたら、ありました。

jQueryUIを利用してUI widgets(用意されているスタイル)を使用する場合には専用のcssも読み込まないと正しく表示されないので注意して下さい。

jqueryUIのcss直リンURL

https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/[テーマ名]/jquery-ui.css

テーマ名は後述

via:jQueryやUI、PrototypeなどのライブラリーをGoogleライブラリAPIから読み込む方法

というわけで、最終的に以下のようにして、使うことができました。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" ></script> <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js" ></script> <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.12/themes/base/jquery-ui.css">

CSSに関しては、BootStarpと共存させたいので、衝突した場合、ちょっと怖いですが、とりあえずは、このままで。