$(document).ready(function() {
	
	$(".glossaire").hover(
		function () {
		
		var title = $(this).text();	
		
		var url = '/tip/index/text/'+escape(title);					
		var de = document.documentElement;
		var w = self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
		var hasArea = w - getAbsoluteLeft($(this));
		var clickElementy = getAbsoluteTop($(this)) - 3; //set y position
		
		$(this).css('cursor','pointer');
		
		var params = new Object ();
		
		params['width'] = '250';
		
		if(hasArea>((params['width']*1)+75)){
			$("body").append("<div id='JT' style='width:"+params['width']*1+"px'><div id='JT_arrow_left'></div><div id='JT_close_left'>"+title+"</div><div id='JT_copy'><div class='JT_loader'><div></div></div>");//right side
			var arrowOffset = $(this).width() + 11;
			var clickElementx = getAbsoluteLeft($(this)) + arrowOffset; //set x position

		} else {
		
			$("body").append("<div id='JT' style='width:"+params['width']*1+"px'><div id='JT_arrow_right' style='left:"+((params['width']*1)+1)+"px'></div><div id='JT_close_right'>"+title+"</div><div id='JT_copy'><div class='JT_loader'><div></div></div>");//left side
			var clickElementx = getAbsoluteLeft($(this)) - ((params['width']*1) + 15); //set x position
		
		}
		
		$('#JT').css({left: clickElementx+"px", top: clickElementy+"px"});
		
		$('#JT').show();
		$('#JT_copy').load(url);
			
        },function(){						
			$('#JT').remove();						
		}
		
	);//hover		
	
	function getAbsoluteLeft(object) {
		o = object;					
		var position = o.position();
		
		return position.left;
	}
	
	function getAbsoluteTop(object) {
		o = object;
		var position = o.position();
		
		return position.top;
	}					

});