jQuery工具提示显示在ajax获取数据时加载gif

我有一个项目列表，用户可以根据需要触发工具提示。我试图在执行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); 
    });
},

将图像加载器（默认情况下隐藏）添加到页面中，例如：

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

---

在发出AJAX请求之前显示图像，完成后再次隐藏图像。

$(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); 
    });
},