blog/2010-07-07
jQueryUI BlockUI
jQueryUIでajax通信時にローディング画像を中央に表示する。
http://pure-essence.net/2010/01/29/jqueryui-dialog-as-loading-screen-replace-blockui/を参考に作成
スクリプト:
$(window).ready(function(){ $('<div id="loadingScreen"></div>').appendTo('body'); var loadingScreen = $("div#loadingScreen"); loadingScreen.dialog({ autoOpen: false, // set this to false so we can manually open it dialogClass: "loadingScreenWindow", closeOnEscape: false, draggable: false, width: 100, height: 100, modal: true, show: 'fade', hide: 'fade', buttons: {
スタイルシート
/* jQueryUI BlockUI */ div#loadingScreen { width:100px; height:100px; cursor:progress; background: url(loading.gif) no-repeat;
「ツールチップもajaxで読みとってるよ。」って人は、ツールチップのajax処理にglobal:falseを追加しないと愉快なことになります。
Last Modified: 2010-07-07 17:28:00