tmpl = '<table id="buble" cellspacing="0" cellpadding="0"><tr><td class="tl">&nbsp;</td><td class="t">&nbsp;</td><td class="tr">&nbsp;</td></tr><tr><td class="l">&nbsp;</td><th><div class="header">{name}</div><div class="comment">{description}</div></th><td class="r">&nbsp;</td></tr><tr><td class="bl">&nbsp;</td><td class="b"><img src="img/b_v.gif" width="10" height="19" alt="" /></td><td class="br">&nbsp;</td></tr></table>';

var bubleVisible = false;
var bubleTimer = false;

function initBubles () {
	for (key in bubles) {
		if (!document.getElementById(key)) continue;
		document.getElementById(key).onmouseover = function (e) {
			if (!e) e = window.event;
			window.clearTimeout(bubleTimer);
			hideBuble();
			tmp_tmpl = tmpl.replace('{name}', bubles[this.id][1]);
			tmp_tmpl = tmp_tmpl.replace('{description}', bubles[this.id][2]);
			document.getElementById('buble_block').innerHTML = tmp_tmpl;
			document.getElementById('buble_block').style.display = 'block';
			if (!bubleVisible) {
				Body = document.getElementsByTagName((document.compatMode && document.compatMode == "CSS1Compat") ? "HTML" : "BODY")[0];
				SY = window.scrollY ? window.scrollY : Body.scrollTop; // Gecko / IE,Opera
				SX = window.scrollX ? window.scrollX : Body.scrollLeft;
				x = e.clientX+SX - 38;
				y = e.clientY+SY - document.getElementById('buble_block').offsetHeight - 5;
				document.getElementById('buble_block').style.left = x + 'px';
				document.getElementById('buble_block').style.top = y + 'px';
			}
			bubleVisible = true;
		}
		document.getElementById(key).onmouseout = function (e) {
			bubleTimer = window.setTimeout('hideBuble()', 300);
		}
	}
}

function hideBuble() {
	document.getElementById('buble_block').style.display = 'none';
	bubleVisible = false;
	window.clearTimeout(bubleTimer);
}

function loadBackGround () {
	document.getElementsByTagName('body')[0].style.backgroundImage = 'url(' + document.getElementsByTagName('base')[0].href+ bg_img + ')';
}