jQuery nav not responding

[cesarcesar]

I'm building a navigation that is built heavily on jQuery. I have it working as needed except that when mousing over links to quickly it spikes the processor and the navigation hangs. By hangs i mean it stops working and even the links will not show rollover states. I thought it was just a matter of adding a stop() but this changed nothing. Any ideas?

 

Here it is online http://sb.cesarvillaca.com/nav/nav.html

 

The code is below.

 

			
<div id="ProductsNav-ov" style="display:none;"></div>

<div id="main-nav">

<ul>
<li class="mainnav-click" id="ProductsNav">PRODUCTS</li>
</ul>

<script type="text/javascript">
<!--
$(function() {

$('.mainnav-click').mouseenter(function() { 
	//alert($(this).attr('id'));
	buildNav($(this).attr('id'));
});

});

function buildNav(nav,sub){

//alert(nav);

var Shredders = new Array({
	Deskside: '',
	Professional: '',
	Commercial: '',
	Government_Approved: '',
	Supplies: ''
});

var Records_Storage = new Array({
	Storage_Drawers: '', 
	Storage_Boxes: '',
	Earth_Series: '',
	Classroom_Organization: '',
	Moving_Boxes: '',
	Magazine_Holders: '',
	Sorters: ''
});

var Workspace_Ergonomics = new Array({
	Keyboard_Trays_and_Drawers: '', 
	Palm_and_Wrist_Supports: '',
	Monitor_Supports: '',
	Back_Supports: '',
	Foot_Supports: '',
	Copyholders: '',
	Monitor_Filters: '',
	Machine_Stands: ''
});

var Workspace_Organization = new Array({
	Desk_Organizers: '', 
	Cubicle_Organizers: '',
	Literature_Organizers: '',
	Mail_Carts: ''
});

var Computer_Accessories = new Array({
	Keyboards_and_Mice: '', 
	Mouse_Pads: '',
	Cleaning_Supplies: '',
	Power_Protection: '',
	Keyguards: ''
});

var CD_DVD_Products = new Array({
	Jewel_Cases_and_Inserts: '', 
	Desktop: ''
});

var Binding_Machines = new Array({
	Plastic_Comb: '', 
	Wire: '',
	Thermal: '',
	Supplies: ''
});

var Laminating_Machines = new Array({
	Personal: '', 
	General_Office: '',
	Supplies: ''
});

var Cutters_and_Trimmers  = new Array({
	Cutters: '',
	Rotary_Trimmers: '',
	Supplies: ''
});

var Mobile_Accessories  = new Array({
	Mobile_Accessories: ''
});

var Refurbished_Shredders  = new Array({
	Refurbished_Shredders: ''
});

var Where_To_Buy  = new Array({
	Where_To_Buy: ''
});

var ProductsNav = {
	"Shredders": Shredders, 
	"Records_Storage": Records_Storage, 
	"Workspace_Ergonomics": Workspace_Ergonomics, 
	"Workspace_Organization": Workspace_Organization, 
	"Computer_Accessories": Computer_Accessories, 
	"CD_DVD_Products": CD_DVD_Products, 
	"Binding_Machines": Binding_Machines, 
	"Laminating_Machines": Laminating_Machines, 
	"Cutters_and_Trimmers": Cutters_and_Trimmers, 
	"Mobile_Accessories": Mobile_Accessories, 
	"Refurbished_Shredders": Refurbished_Shredders, 
	"Where_To_Buy": Where_To_Buy 
};

if (sub==undefined) {

	var navPOP='';
	navPOP+=

	'<div id="drop-down-container">'+
		'<div id="mainnav-title-ov">'+
			'<div class="sprite main-nav-left lfloat"></div>'+
			'<div class="main-nav-center auto-width">PRODUCTS</div>'+
			'<div class="sprite main-nav-right lfloat"></div>'+
			'<br class="clear">'+
		'</div>'+
		'<div id="drop-down" class="auto-width">'+
			'<div id="mainnav-container" class="dots">'+
				'<ul id="mainnav">';

				var navname = "";
				$.each(eval(nav), function(mainNav, mainNavobject) {

					$.each(mainNavobject, function(i, subNavobject) {

						$.each(subNavobject, function(property, value) {

							if (navname != mainNav) {

								navname = mainNav;

								navPOP+= '<li><a href="' + value + '" class="subnav-click" id="' + mainNav + '">'+str_replace("_"," ",mainNav)+'</a></li>';

							}

						});

					});

				});

				navPOP+= 

				'</ul>'+
			'</div>'+
			'<div id="drop-down-sub"></div>'+
			'<br class="clear">'+
		'</div>'+
	'</div>';

	var whatmenu = nav+'-ov';

	$('#'+whatmenu).html(navPOP);
	$('#mainnav-container').removeClass('dots');

	$('#'+whatmenu).position({ my: "left top", at: "left top"});

	$('#'+whatmenu).show();

}else{

	//$("#drop-down-sub").stop();

	$('#drop-down-sub').empty();

	var navPOPsub='';
	navPOPsub+= '<ul id="subnav">';

	$.each(eval(nav), function(mainNav, subNavobject) {

		$.each(subNavobject, function(property, value) {

			navPOPsub+= '<li><a href="' + value + '">'+str_replace("_"," ",property)+'</a></li>';

		});

	});

	navPOPsub+= '</ul>';

	$('#mainnav-container').addClass('dots');
	$('#drop-down-sub').html(navPOPsub);
	$('#drop-down-sub').show();
}

$('.subnav-click').mouseover(function() { 
	buildNav($(this).attr('id'),1);
});

$('#drop-down-container').mouseleave(function() { 
	$('#ProductsNav-ov').hide();
});

}
//-->
</script>

</div>

</div>