var $j = jQuery.noConflict();
     // Use jQuery via $j(...)
	$j(document).ready(function(){
	
		// remove link background images since we're re-doing the hover interaction below 
		// (doing it this way retains the CSS default hover states for non-javascript-enabled browsers)
		// we also want to only remove the image on non-selected nav_top items, so this is a bit more complicated
		$j(".nav_top").children("li").each(function() {
			var current = "nav_top current-" + ($j(this).attr("class"));
			var parentClass = $j(".nav_top").attr("class");
			if (parentClass != current) {
				$j(this).children("a").css({backgroundImage:"none"});
			}
		});	


		// create events for each nav_top item
		attachnav_topEvents(".nav_top", "new_here");
		attachnav_topEvents(".nav_top", "connect");
		attachnav_topEvents(".nav_top", "time_location");

		function attachnav_topEvents(parent, myClass) {
			$j(parent + " ." + myClass).mouseover(function() {
				$j(this).append('<div class="nav_top-' + myClass + '"></div>');
				$j("div.nav_top-" + myClass).css({display:"none"}).fadeIn(400);
			}).mouseout(function() {
				$j("div.nav_top-" + myClass).fadeOut(400, function() {
					$j(this).remove();
				});
			}).mousedown(function() {
				$j("div.nav_top-" + myClass).attr("class", "nav_top-" + myClass + "-click");
			}).mouseup(function() {
				$j("div.nav_top-" + myClass + "-click").attr("class", "nav_top-" + myClass);
			});
		}



	});