(function($) {
	$(document).ready(function() {
		for (var i = 1; i <= 4; i++) {
			(function() {
				var $symbol = $(".symbol-" + i);
				var $tooltip = $(".tooltip-" + i);
				var is_visible = false;
				var timeout = null;
				function update_visibility(new_visibility) {
					if (timeout) {
						window.clearTimeout(timeout);
						timeout = null;
					}
					timeout = window.setTimeout(function () {
						if (is_visible != new_visibility) {
							if (new_visibility) {
								if (jQuery.browser.msie) { // IE6 z-index BUG!!!!
									$("#navigation > ul").css("z-index", "-1");
									$("#content").css("z-index", "-1");
								}
								$tooltip.fadeIn();
							} else {
								if (jQuery.browser.msie) { // IE6 z-index BUG!!!!
									$("#navigation > ul").css("z-index", "10");
									$("#content").css("z-index", "1");
								}
								$tooltip.fadeOut();
							}
							is_visible = new_visibility;
						}
					}, 100);
				}
				$tooltip.hover(
					function() {
						update_visibility(true);
					},
					function() {
						update_visibility(false);
					}
				);
				$symbol.hover(
					function() { update_visibility(true); },
					function() { update_visibility(false); }
				);
			})();
		}
		
		$('.smash-button').mousedown(
			function () {
				$(this).addClass('active');
			}
		).mouseup(
			function () {
				$(this).removeClass('active');
			}
		).hover(
			function () {
				$(this).addClass("hover");
			},
			function () {
				$(this).removeClass("hover");
			}
		);
	});
})(jQuery);

jQuery Tooltip: SmashingMag.com

jquery

JavaScript