jQuery UI でダイアログ表示 - Pyro Memo
別の記事でも書いたけど、個人で開発しているWebアプリでは、だいたいjQuery UIを使用してる。 今回はその中でもよく利用しているdialogの使い方をまとめておく。dialog機能を使うと、割と簡単にエラーダイアログやフォーム表示用のサブウィンドウを作成することができる。http://jqueryui.com/demos/dialog/ 僕の使い方としては、あらかじめ使用するダイアログやサブウィンドウをHTML内に非表示で埋め込んでおき、必要な時にダイアログとして表示する、という方法をとっている。1つのファイルにまとまってると、本体のHTML、ダイアログ、サブウィンドウを区別なく編集できるので結構楽だと思う。 OKダイアログ（通知やエラー表示用）、確認ダイアログ、フォームダイアログをそれぞれ表示できるサンプルを書いておく。よく使うOKダイアログや確認ダイアログは関数化しておくと便利。
jQuery UI.Layout Plugin を使って単一ページUIを作る - Pyro Memo
Google App Engineを使うようになって、リクエスト時間の節約のために重いページ（HTML）のロードは最初の1回だけにして、以降はページ遷移なしでAjaxでJSONのやりとりをしてビューを変更するような方法をとることが多くなった。 UIについても毎回デザインを考えるのも面倒だしロクなものができなかったので、jQueryUIとjQuery UI.Layout Pluginを利用するようになった。この2つを利用するだけでアプリケーション風のUIが実現できて、UI関連の悩みをほぼ解消してくれた。 jQueryUIはボタンやタブ、アコーディオンメニューなどのUIウィジェットを、jQueryUIのサイト上で作成したデザインテーマに合わせて表示してくれるので、統一感のあるデザインがてっとり早くできる。自分でカスタマイズした設定を再編集できるようにしてくれたらもっと便利なのだけど。http:
第5回 jQuery UIによるユーザインターフェースの改良 | gihyo.jp
今回使用する「Dialog」「Draggables」「Droppables」「Sortables」に必要なファイルは以下の通りです。 themes/ jquery-1.2.3.min.js jquery.dimensions.js ui.mouse.js ui.resizable.js ui.dialog.js ui.draggable.js ui.draggable.ext.js ui.droppable.js ui.droppable.ext.js ui.sortable.ext.js ui.sortable.js jQuery UI 1.5bを使うために、今回は同梱されているjQuery 1.2.3を使うことにします。バージョンが上がりますが、これまでのサンプルの動作に影響はありません。 ライブラリの設定 ライブラリの各ファイルを、head要素の子要素に以下のように指定します（
jQuery UI の プラグイン定義関数 $.widget を使ってみる - Cyokodog :: Diary
jQuery UI の tabs や accordion といったウィジェット系プラグインでは、専用のプラグイン定義関数 $.widget でプラグイン定義することで、一環性のあるプラグイン API を利用者に提供しています。 今回は、$.widget を使ったプラグインの定義方法について調べてみました。 ui.core.js の入手 $.widget は jQuery UI の ui.core.js というソースファイル内に定義されてます。 公式サイト（http://jqueryui.com/download）よりプラグイン一式をダウンロードし、zip ファイルを解凍すると、以下パスに ui.core.js があるので、これを読み込み $.widget を使用できるようにします。 jquery-ui-1.7.2.custom/development-bundle/ui/ui.core.j
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
