添加圖形到JQuery UI Ajax選項卡？

Question

如何將加載圖形添加到JQuery UI ajax選項卡？因此它暫停了半秒，顯示圖形然後加載內容？

這裏是我的代碼：

<script type="text/javascript"> 
$(function() { 
    $("#tabs").tabs({ 
     ajaxOptions: { 
      error: function(xhr, status, index, anchor) { 
       $(anchor.hash).html("I tried to load this, but couldn't. Try one of the other links?"); 
      } 


     } 
    }); 
}); 

這就是我要的情況下，使用圖形的類型，你不知道：

謝謝！

Answer 1

從UI的例子@http://jqueryui.com/demos/tabs/#option-spinner

此字符串的HTML內容被示出在其選項卡的當加載遠程內容。傳入空字符串以禁用該行爲。標題的A標記中必須存在一個span元素，以使微調器內容可見。

Get or set the spinner option, after init. 

    //getter 
    var spinner = $(".selector").tabs("option", "spinner"); 
    //setter 
    $(".selector").tabs("option", "spinner", 'Retrieving data...'); 

所以，你的代碼將是：

$(function() { 
    $("#tabs").tabs({ 
     ajaxOptions: { 
      error: function(xhr, status, index, anchor) { 
       $(anchor.hash).html("I tried to load this, but couldn't. Try one of the other links?"); 
      }, 
spinner: '<img src="http://i.stack.imgur.com/Pi5r5.gif" />' 


     } 
    }); 
});