// Specify the width of the top navigation menu
var topNav = 958;

function setup() {

// Write out your submenus here, as if you were inserting them as regular HTML.
// Separate each line with a backslash (this makes the markup look neater).

	var menus = '\
	<ul class="hidden" id="submenu2">\
		<li><a href="/Web-Design/Premium-Web-Design.php">Premium design</a></li>\
		<li><a href="/Web-Design/Webmaster-Services.php">Webmaster services</a></li>\
		<li><a href="/Web-Design/SEO-Search-Engine-Optimization.php">SEO services</a></li>\
	</ul>\
	<ul class="hidden" id="submenu3">\
		<li><a href="/Ecommerce/Shopping-Carts.php">Shopping carts</a></li>\
		<li><a href="/Ecommerce/SSL-Certificates.php">SSL certificates</a></li>\
		<li><a href="/Ecommerce/Merchant-Processing.php">Merchant processing</a></li>\
	</ul>\
	<ul class="hidden" id="submenu4">\
		<li><a href="/Business-Hosting/Web-Hosting.php">Web hosting</a></li>\
		<li><a href="/Business-Hosting/Managed-Servers.php">Managed servers</a></li>\
		<li><a href="/Business-Hosting/Exchange-Email-Hosting.php">Exchange email hosting</a></li>\
	</ul>\
	';
 	document.getElementById('submenu').innerHTML = menus;
}

function menuSwitch(foo) {
	menuOff();
	var margin = 0;
	for (i=1 ; i<foo ; i++) {
		margin = parseFloat(margin) + document.getElementById('nav1_'+i).offsetWidth;
	}
	document.getElementById('submenu'+foo).style.display = 'block';
	if (document.getElementById('nav1_'+foo).offsetWidth > document.getElementById('submenu'+foo).offsetWidth) {
		var bigger = document.getElementById('nav1_'+foo).offsetWidth;
		var smaller = document.getElementById('submenu'+foo).offsetWidth;
		margin = parseFloat(margin) + parseFloat(((bigger-smaller)/2).toFixed(0));
	}
	var navsWidth = 0;
	var navItems;
	navItems = document.getElementsByTagName('li');
	for (i=0 ; i<navItems.length ; i++) {
		if (navItems[i].className === 'topnav') navsWidth = parseFloat(navsWidth) + parseFloat(navItems[i].offsetWidth);
	}
	margin = parseFloat(margin) + ((topNav-parseFloat(navsWidth))/2);
	document.getElementById('submenu'+foo).style.marginLeft = margin+'px';
}

function menuOff() {
	var submenus;
	submenus = document.getElementsByTagName('ul');
	for (i=0 ; i<submenus.length ; i++) {
		if (submenus[i].className === 'hidden') submenus[i].style.display = 'none';
	}
}

// Form activation script
function activate(brillig) {
	document.getElementById('config').name = "config";
	document.getElementById('config').value = brillig;
}

window.onload = setup;