#navi(../) *jQueryUI BlockUI [#ifc4846a] jQueryUIでajax通信時にローディング画像を中央に表示する。 http://pure-essence.net/2010/01/29/jqueryui-dialog-as-loading-screen-replace-blockui/を参考に作成。 スクリプト: #sh(js){{ $(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: {}, resizable: false, open: function() { // scrollbar fix for IE $('body').css('overflow','hidden'); }, close: function() { // reset overflow $('body').css('overflow','auto'); } }); // end of dialog $(document).ajaxStart(function(){ $('body').css('cursor','wait'); loadingScreen.dialog('open'); }).ajaxStop(function(){ loadingScreen.dialog('close'); $('body').css('cursor','auto'); }); }); }} スタイルシート #sh(css){{ /* jQueryUI BlockUI */ div#loadingScreen { width:100px; height:100px; cursor:progress; background: url(loading.gif) no-repeat; } /* タイトルバーを隠す */ div.loadingScreenWindow .ui-dialog-titlebar { display: none; } }} 「ツールチップもajaxで読みとってるよ。」って人は、ツールチップのajax処理にglobal:falseを追加しないと愉快なことになります。
Founded by Logue