Return to Snippet

Revision: 13281
at April 17, 2009 10:54 by davebowker


Initial Code
$("#ukn-topbar li.ukn-subnav").load("/menu", "", function(responseText, textStatus, XMLHttpRequest){
			//alert(' - textStatus:' + textStatus +' - status: '+ XMLHttpRequest.status);
			if (responseText != '' && textStatus == 'success' && XMLHttpRequest.status == 200)
			{
				initMenuItem('general');
			 	initMenuItem('music');
				initMenuItem('fashion');
				initMenuItem('film');
				initMenuItem('tv');
				initMenuItem('sport');
			} else {
				//alert(' - textStatus:' + textStatus +' - status: '+ XMLHttpRequest.status);
			}
		}
	);
	
	function initMenuItem(cat_name) {
		$("#ukn-topbar ul li.ukn-subnav ul").hide();
		$("#ukn-topbar ul li.ukn-subnav").show();
		$("#ukn-topbar ul li.ukn-cat-" + cat_name).append("<a class='ukn-subnav-trigger' href='#' title='Expand " + cat_name + "'>Open</a>");
		
		$("#ukn-topbar ul li.ukn-cat-" + cat_name + " a.ukn-subnav-trigger").click(function () {
		    if ($(this).hasClass('ukn-active')) {
				$("#ukn-topbar ul li a.ukn-subnav-trigger").removeClass("ukn-inactive");
				$(this).removeClass("ukn-active").html('Open');
		    	$("#ukn-topbar ul li.ukn-subnav ul.ukn-subnav-"+ cat_name).hide();
		    } else if ($(this).hasClass('ukn-inactive')) {
				$("#ukn-topbar ul li a.ukn-subnav-trigger").removeClass('ukn-active').addClass("ukn-inactive").html('Open');
				$(this).addClass("ukn-active").removeClass("ukn-inactive").html('Close');
		    	$("#ukn-topbar ul li.ukn-subnav ul:visible").hide();
				$("#ukn-topbar ul li.ukn-subnav ul.ukn-subnav-"+ cat_name).show();
		    } else {
				$(this).addClass("ukn-active").html('Close');
				$("#ukn-topbar ul li a.ukn-subnav-trigger:not('.ukn-active')").addClass("ukn-inactive");
		    	$("#ukn-topbar ul li.ukn-subnav ul.ukn-subnav-"+ cat_name).show();
		    }
	    });
	}

Initial URL


Initial Description
Standard list markup, adds button to expand a super dropdown next to the link.

Initial Title
jQuery Advanced Menu Nav

Initial Tags
dropdown, navigation, jquery

Initial Language
JavaScript