$(document).ready(function() {
	var hide = new Object();
	$("img.mouseOverButton").each(
				function() {
					// preload the "mouseOverSrc" image
					var img = new Image();
					img.src = $(this).attr("mouseOverSrc");

					// copy the img.mouseOverButton's src attribute over to a new attribute called "mouseOutSrc"
					$(this).attr("mouseOutSrc", this.src);
				}
			)
	$("img.mouseOverButton, div.mouseOverButtonPanel").hover(function() {
		var myId = cleanseMouseOverId(this.id);
		if (hide[myId]) {
			clearTimeout(hide[myId]);
			hide[myId] = 0;
		}
		else {
			showMouseOverPanel(myId, true);
		}
	}, function() {
		//log(this);
		var myId = cleanseMouseOverId(this.id);
		hide[myId] = setTimeout(function() {
			showMouseOverPanel(myId, false);
			hide[myId] = 0;
		}, 150);
	});
});
function showMouseOverImage(id, show) {
	var attr = (show) ? "mouseOverSrc" : "mouseOutSrc";
	id = "#" + id;
	var img = $(id);
	img.attr("src", img.attr(attr));
}
function showMouseOverPanel(id, show) {
	//alert(id);
	showMouseOverImage(id, show);
	if (show) {
		$("#" + id + "Panel").fadeIn("fast");
	}
	else {
		id = cleanseMouseOverId(id);
		$("#" + id + "Panel").fadeOut("fast");
	}
}
function cleanseMouseOverId(id) {
	return id.replace("Panel", "");
}
function log(msg) {
	var taLog = document.getElementById("log")
	if (taLog)
		taLog.value += ("\n" + msg);
}