$(function(){		   
	   $("body").append('<table id="dpop"  class="bubblepopup">'+
		'<tbody><tr>'+
			'<td id="bubbletopleft" class="bubblecorner"></td>'+
			'<td class="bubbletop"></td>'+
			'<td id="bubbletopright" class="bubblecorner"></td>'+
		'</tr>'+
		'<tr>'+
			'<td class="bubbleleft"></td>'+
			'<td style="margin: 0;padding: 0;">'+
	'<div id="bubblecontent"></div>'+
			'</td>'+
			'<td class="bubbleright"></td>'+
		'</tr>'+
		'<tr>'+
			'<td class="bubblecorner" id="bubblebottomleft"></td>'+
			'<td class="bubblebottom" height="29"></td>'+
			'<td id="bubblebottomright" class="bubblecorner"></td>'+
		'</tr>'+
	 '</tbody></table>'); 


		var distance = 20;
		var time = 250;
		var hideDelay = 500;

		var hideDelayTimer = null;
		var beingShown = false;
		var shown = false;
		var trigger = $('.bubble', this);
		var info = $('#dpop', this).css('opacity', 0);

		$('#dpop').livequery(function(){
		   $(this).hover(function(){
   			if (hideDelayTimer) clearTimeout(hideDelayTimer);								  
         },function(){
			   hideDelayTimer = setTimeout(function () {
				hideDelayTimer = null;
				info.animate({
					top: '-=' + distance + 'px',
					opacity: 0
				}, time, 'swing', function () {
					shown = false;
					info.css('display', 'none');
				});

   			}, hideDelay);			
   		});
		});
		$('.bubble').livequery(function(){
		   $(this).hover(function (e) {
   			if (hideDelayTimer) clearTimeout(hideDelayTimer);											
   			if (beingShown && shown==$(this).attr('bubble')) { // trigger again?
   				return false;
   			} else {
   				beingShown = true;
   			
   				$('#bubblecontent').html($(this).attr('bubble'));
   				var objectX = (e.pageX);
   				var objectY = (e.pageY-($("#bubblecontent").height()));
   			
   				var scrollTop = $(document).scrollTop();
   				var scrollLeft = $(document).scrollLeft();
   				
   				//var posX = (scrollLeft+objectX) - $('#dpop').outerWidth() - $('.bubble').outerWidth();
   				
   				var posX = (scrollLeft+objectX+20);
   				if($(document).width() < posX+250){
   				   posX -= 300;
   				}
   				//var posY = (scrollTop+objectY) - $('.bubble').outerHeight() + distance;			
   				var posY = (objectY) - $('.bubble').outerHeight() + distance;	
   				if($(document).height() < posY+objectY){
   				//   posY -=  ($("#bubblecontent").height());
   				}   
   				
   				info.css({
   					 top: posY,
   					 left: posX,
   					 display: 'block'
   				 }).animate({
   					top: '-=' + distance + 'px',
   					opacity: 1
   				 }, time, 'swing', function() {
   					 beingShown = false;
   					 shown = $(this).attr('bubble');
   				 });				
   
   			}
   
   			return false;
   		},function() {
   			if (hideDelayTimer) clearTimeout(hideDelayTimer);
   			hideDelayTimer = setTimeout(function () {
   				hideDelayTimer = null;
   				info.animate({
   					top: '-=' + distance + 'px',
   					opacity: 0
   				}, time, 'swing', function () {
   					shown = false;
   					info.css('display', 'none');
   				});
   
   			}, hideDelay);
   
   			return false;
   		});
	   });
  });