myExtraContent1
myExtraContent2

 
赤表示本参考
jQuery UIインターフェース
http://jqueryui.comQuickdownloadsから取得。
jquery-ui-1.10.2.customフォルダが出来る。
  • jsフォルダのjquery-ui-1.10.2.custom.min.js
  • css>ui-lightnessフォルダのjquery-ui-1.10.2.custom.css
  • development-bundle>ui>i18nフォルダのjquery.ui.datepicker-ja.js(UIを日本語化するためのファイル)
  • imagesフォルダ内のファイル全部
  • これで、jQuery UIを利用出来るようになる。

RapidWeaver内で利用するにはリソースに入れる。パスは ../resources/ファイル名 である。

../resources/js/jquery-ui-1.10.2.custom.min.js
../resources/js/jquery.ui.datepicker-ja.js
../resources/css/jquery-ui-1.10.2.custom.css
../resources/images/ファイル名

読み込みの順番に注意。
jQuery→jQuery UIの順番で読み込む
jquery.ui.datepicker-ja.js ファイルはdatepickerメソッドを使う場合にだけ必要。

jQuery UIの基本
$(UIの適用先を表すセレクター).機能名(パラメータ,・・・・)
(例)
$('#date').datepicker($.datepicker.regional['ja']);
この場合 id="date"に日付選択ボックス(datepicker)の機能を付与するという意味。($.datepicker.regional['ja'])は、カレンダーの表示に日本語を使用するという意味になる。

デモがあるサイト 
http://jqueryui.com/demos/


myExtraContent3