easyui dialog 擴充load

標籤：style   blog   color   os   io   ar   cti   div   

 1 $.extend($.fn.panel.methods, {
 2     showMask: function(jq, msg){
 3         return jq.each(function(){
 4             var pal = $(this).panel(‘panel‘);
 5             if (pal.css(‘position‘).toLowerCase() != ‘absolute‘){
 6                 pal.css(‘position‘,‘relative‘);
 7             }
 8             var borderSize = parseInt(pal.css(‘padding‘))+1;
 9             var m = pal.children(‘div.panel-mask‘);
10             if (!m.length){
11                 m = $(‘<div class="panel-mask"></div>‘).appendTo(pal);
12             }
13             m.css({
14                 background:‘#fff‘,
15                 left:borderSize,
16                 top:(borderSize+pal.children(‘.panel-header‘)._outerHeight()),
17                 right:borderSize,
18                 bottom:borderSize
19             });
20             m.children(‘div.panel-mask-msg‘).remove();
21             var mm = $(‘<div class="panel-mask-msg"></div>‘).appendTo(m);
22             mm.html(msg).css({position:‘absolute‘}).css({
23                 position:‘absolute‘,
24                 top: ‘50%‘,
25                 left: ‘50%‘,
26                 marginTop: -mm._outerHeight()/2,
27                 marginLeft: -mm._outerWidth()/2
28             })
29         });
30     },
31     hideMask: function(jq){
32         return jq.each(function(){
33             $(this).panel(‘panel‘).children(‘div.panel-mask‘).remove();
34         })
35     }
36 });

1 $(‘#dlg‘).dialog(‘showMask‘, ‘Loading...‘);  // display the loading message
2 $(‘#dlg‘).dialog(‘hideMask‘);  // hide the loading message