Tip

$(function()
{
  var hideDelay = 500;
  var currentID;
  var hideTimer = null;

  // One instance that's reused to show info for the current person
  var container = $('<div id="personPopupContainer">'
      + '<table width="" border="0" cellspacing="0" cellpadding="0" align="center" class="personPopupPopup">'
      + '<tr>'
      + '   <td> </td>'
      + '   <td></td>'
      + '   <td></td>'
      + '</tr>'
      + '<tr>'
      + '   <td></td>'
      + '   <td><div id="personPopupContent"></div></td>'
      + '   <td></td>'
      + '</tr>'
      + '<tr>'
      + '   <td></td>'
      + '   <td></td>'
      + '   <td></td>'
      + '</tr>'
      + '</table>'
      + '</div>');

  $('body').append(container);

  $('.personPopupTrigger').live('mouseover', function()
  {
      // format of 'rel' tag: sname,url
      var settings = $(this).attr('rel').split(',');
      var sname = settings[0];
      var url = settings[1];

      // If no sname in url rel tag, don't popup blank
      if (sname == '')
          return;

      if (hideTimer)
          clearTimeout(hideTimer);

      var pos = $(this).offset();
      var width = $(this).width();
      container.css({
          left: (120) + 'px',
          top: pos.top - 5 + 'px'
      });

      //$('#personPopupContent').html('<span style="color:#FFFFFF;">Esto seria el texto.</span>');

     /* $.ajax({
          type: 'GET',
          url: url,
          data: 'sname=' + sname + '&url=' + url,
          success: function(data)
          {
            var text = $(data).find('.personPopupResult').html();
            $('#personPopupContent').html(text);
          }
      }); */
      $('#personPopupContent').load( url , {sname : sname});


      container.css('display', 'block');
  });

  $('.personPopupTrigger').live('mouseout', function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
      hideTimer = setTimeout(function()
      {
          container.css('display', 'none');
      }, hideDelay);
  });

  // Allow mouse over of details without hiding details
  $('#personPopupContainer').mouseover(function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
  });

  // Hide after mouseout
  $('#personPopupContainer').mouseout(function()
  {
      if (hideTimer)
          clearTimeout(hideTimer);
      hideTimer = setTimeout(function()
      {
          container.css('display', 'none');
      }, hideDelay);
  });
});