var offset_x = 20;
var offset_y = 10;
var doc_width;

function infoBoxesInit() {
// prepare the popup infoboxes

// change their location in the DOM, move them to the body element
	$("#content-container2 [id^='infobox']").each(function(i){
		$(this).clone(true).appendTo("body");
		$(this).remove();
	});

// create the events handlers
	$("#content-container2 a[rel^='infobox']").each(function(i){
		$(this).mouseover(function(){
			$("#"+$(this).attr("rel")).show();
		});
		$(this).mousemove(function(e){
			var el_width = $("#"+$(this).attr("rel")).width();
			var correction_x = (doc_width - e.pageX) - el_width;
			if (correction_x > offset_x) {
				correction_x = offset_x;
			}
			$("#"+$(this).attr("rel")).css({ left:e.pageX + correction_x, top:e.pageY + offset_y });
		});
		$(this).mouseout(function(){
			$("#"+$(this).attr("rel")).hide();
		});
	});
}

$(document).ready(function(){
	doc_width = $(document).width();

	infoBoxesInit();
});