JQueryUIをつかってみたpart1

おつかれさまですた。

ブログ更新がんばろーと思ってます。(いつもどおり続かない)

いやー今週、福岡は雨がひどいですね。 西鉄電車(通勤で使っている電車)が遅延しちゃったりなんかしちゃったりして・・・ 現場に行くのもめんどくさい感あります。。

さてさて、JQuery UIあるのは知ってたのですが、つかったことがなかったので、使ってみました。 ちなみに、jsdo.it(ブラウザ上で、HTML,CSS,JSを書いて、動かすことができる)もあんまり使用したことなかったので、使ってみることに・・ エディターでemmetが効くようで、便利便利。

1.JQuery UIとはなんぞや

Query UI とは、jQuery公式のユーザインターフェース(UI)用ライブラリのこと。カレンダー、タブ、アコーディオン、ダイアログ、エフェクト、並べ替え、表示切替、ドラッグ移動、ドロップ、サイズ変更、スライダーなど、多様な UI を簡単に導入できる。

らしいです!ここに書いてました!(おい

2.やってみた

いろいろあるようなので、公式からWidgetsの中のAccordion,Autocomplete,Datepicker,Dialog,Menuのデフォルトバージョンを使ってみました。 どれも使うのは簡単で、HTMLを記述した後にJQueryを読み込むときに一行書く位で使えました。 たとえばDatePickerなら下記のような感じ・・・

※HEADタグの中にjqueryとjqueryUIを呼び出すタグの記載が必要になります。

下記のように、

<!--HTML-->
<label for="datepicker">DatePicker
<input id="datepicker" type="text" />
//Jsはこれだけ
$(function(){
    $("#datepicker").datepicker();
});

簡単簡単。。書き込んでいる文字列は気にしないように。。

使う機会はあるのだろうか・・・