Search:


Main.JSMenuPanelResizing

Recent Changes
Printable View
Page History
Edit Page 


if (!window.jQuery)
{
	alert("No jquery");	
}

// get the 'key children" menu items
var importantMenuItems = [];
importantMenuItems.push(document.getElementById("main-menu-responsive-aboutus"));
importantMenuItems.push(document.getElementById("main-menu-responsive-services"));
importantMenuItems.push(document.getElementById("main-menu-responsive-solutions"));
importantMenuItems.push(document.getElementById("main-menu-responsive-products"));
if (importantMenuItems.length != 4)
{
	alert("Not enough menu items");
}

// get their parents, the panel container/background
window.mainMenuDropDownPanels = [];
var mainMenuItemCount = importantMenuItems.length;
for (var i = 0; i < mainMenuItemCount; i++)
{
	alert("IN LOOP #" + i);
	var parentNode = importantMenuItems[i].parentNode;
	alert("parentNode of #" + i + ": " + parentNode);
	if (parentNode)
	{
		alert("Adding parent of #" + i);
		window.mainMenuDropDownPanels.push(parentNode);
		alert("Added #" + i);
	}
	else
	{
		alert("Parent of item " + i + " is null");
	}
	alert("End of loop #" + i);
}
if (window.mainMenuDropDownPanels.length != 4)
{
	alert("Not enough panels");
}

// A function to be called on every resize event
function resizeMainMenuPanels()
{
	//alert("Resize event");

	// get viewport width (making use of jQuery)
	var theViewportWidth = window.jQuery(window).width();
	//alert("theViewportWidth: " + theViewportWidth);

	// set width of main menu background panels
	var mainMenuCount = window.mainMenuDropDownPanels.length;
	for (var i = 0; i < mainMenuCount; i++)
	{
		var theMenu = window.mainMenuDropDownPanels[i];
		if (theViewportWidth <= 1366) // or use <, <=, >= etc
		{	
			theMenu.style.width = theViewportWidth + "px";
		}
		else
		{
			theMenu.style.width = 1366 + "px";
		}
	}
}

alert("Registering resize...");
// register the above resize function to run on window resize
window.jQuery(window).resize(resizeMainMenuPanels);

// call it for the first time
alert("Calling resize");
resizeMainMenuPanels();
alert("Done.");