jQueryツールチップを表示するGIFをロード中Ajaxがデータを取得する

Question

私は、必要に応じてユーザーがツールチップを起動できるアイテムのリストを持っています。私はajax呼び出しがツールチップウィンドウで適切なデータを取得するために実行されている間に、ロードGIFを表示しようとしています。

どうすればこの問題を解決できますか？

$(document).tooltip({ 
    items:'.tooltip', 
    tooltipClass:'toolTipDetails', 
    position: { my: "left+5 top", at: "right center" } 
    content:function(callback) { 
     var id = $(this).attr('id'); 

     $.get('tickets/tooltips.php', { 
     id:id 
     }, function(data) { 
     callback(data); 
    }); 
}, 

Answer 1

例えば、あなたのページに（デフォルトでは非表示）画像ローダーを追加します。

$(document).tooltip({ 
    items:'.tooltip', 
    tooltipClass:'toolTipDetails', 
    position: { my: "left+5 top", at: "right center" } 
    content:function(callback) { 
     var id = $(this).attr('id'); 

     $('#loader').show(); // <------ Show loader 

     $.get('tickets/tooltips.php', { 
     id:id 
     }, function(data) { 
     $('#loader').hide(); // <------ Hide loader 
     callback(data); 
    }); 
}, 

・ホープ、このことができます：

<img src="loader.gif" id="loader" style="display:none"/> 

その後、あなたはjQueryのを使用して、それをtoogle可能性のようなshow()/hide()を機能します。