Help tweaking Jquery Nav Script

programming web dev
1

How could I change this nav script to pull the class 'current-___'from the body tag?

I think the relevant part is


var parentClass = $(parent).attr('class');

	$(parent).children('li').each(function() {
		var myClass = ($(this).attr('class'))
		var current = parent.substring(1) + ' current-' + ($(this).attr('class'));

but the whole script is…



// Navigation
generateSprites('.nav', 'current-', true, 300, 'fade');


function generateSprites(parent, selectedPrefix, setActive, hoverSpeed, style) {
	var parentClass = $(parent).attr('class');

	$(parent).children('li').each(function() {
		var myClass = ($(this).attr('class'))
		var current = parent.substring(1) + ' current-' + ($(this).attr('class'));

		attachNavEvents(parent, myClass, setActive, hoverSpeed, style);
	
		if (parentClass != current) {
			$(this).children('a').css({backgroundImage:'none'});
		}

	});
}

function attachNavEvents(parent, myClass, setActive, hoverSpeed, style) {
	$(parent + ' .' + myClass).mouseover(function() {
		$(this).append('<div class="nav-' + myClass + '"></div>');
		if (style == 'slide') {
			$('div.nav-' + myClass).css({display:'none'}).slideDown(hoverSpeed);
		} else {
			$('div.nav-' + myClass).css({display:'none'}).fadeIn(hoverSpeed);
		}
	}).mouseout(function() {
		if (style == 'slide') {
			$('div.nav-' + myClass).slideUp(hoverSpeed, function() {
				$(this).remove();
			});
		} else {
			$('div.nav-' + myClass).fadeOut(hoverSpeed, function() {
				$(this).remove();
			});
		}
	});

	if (setActive) {
		$(parent + ' .' + myClass).mousedown(function() {
			$('div.nav-' + myClass).attr('class', 'nav-' + myClass + '-click');
		}).mouseup(function() {
			$('div.nav-' + myClass + '-click').attr('class', 'nav-' + myClass);
		});
	}
}

currently a sample css of a nav item looks like

/* home */
	.nav .home a:link, .nav .home a:visited {
		left: 0;
		width: 70px;
	}
	.nav .home a:hover, .nav .home a:focus {
		background: url(../images/nav.png) no-repeat 0px -36px;
	}
	.nav .home a:active {
		background: url(../images/nav.png) no-repeat 0px -72px; 
	}
	.current-home .home a:link, .current-home .home a:visited {
		background: url(../images/nav.png) no-repeat 0px -108px;
		cursor: default;
	}
	.nav-home, .nav-home-click {
		background: url(../images/nav.png) no-repeat 0px -36px;
		position: absolute;
		left: 0; top: 0;
		height: 35px; width: 70px;