$(document).ready(function () {

  function popup_html(message) {
    return (
      '<div id="popup" class="popup-container">' +
      '<table cellspacing="0" cellpadding="0">' +
        '<tr>' +
      		'<td class="popup-top"></td>' +
      	'</tr>' +
      	'<tr>' +
      		'<td class="popup-middle">' +
      			'<div class="popup-text">' + message +'</div>'+ 
      		'</td>' +
      	'</tr>' +
      	'<tr>' +
      		'<td class="popup-bottom"></td>' +
      	'</tr>' +
      '</table>' +
      '</div>' 
    );
  }

  var xOffset = 0, yOffset = -42;
  
  $(".popup").live('mouseover', function (event) {
    var self = $(this);
    var text = jQuery.trim(self.attr("message"));
  
    if (text === "") { return; }
  
  	if ($("#popup").length == 0) {
  		$("body").append(popup_html(text));
  	} else {	  
      $("#popup .popup-text").html(text);
  	}

    xOffset = -$("#popup").height() - 3;
    
    $("#popup")
      .css("top",  parseInt(event.pageY, 10) + xOffset + "px")
      .css("left", parseInt(event.pageX, 10) + yOffset + "px")
      .show();
  })
  .live('mouseout', function () {
  	$("#popup").hide();
  })
  .live('mousemove', function (event) {
    $("#popup")
  		.css("top", (event.pageY + xOffset) + "px")
  		.css("left",(event.pageX + yOffset) + "px");
  });

});