functions.js

经典的结构设计资料 配合很美观的实物效果图加以说明

///////////////////////////////////////////////////////////
//
//	FUNCTIONS TO CREATE DINAMIC GENERATED MENUS
//
///////////////////////////////////////////////////////////
//
//	This file contains some functions that,
//	when called correctly, reads a predefined
//	Array containing data, creates a <DIV>,
//	creates HTML code that draw the menu,
//	and writes this code in the <DIV>
//
//	This file is divided in two main parts:
//	one that generates static navigation menus,
//	and other that generates a dinamic menu
//	that responds to onmouseover events to
//	open subitens.
//
///////////////////////////////////////////////////////////

///////////////////////////////////////////////////////////
//	BROWSER RECOGNITION
///////////////////////////////////////////////////////////

var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;

///////////////////////////////////////////////////////////
//	GLOBAL VARIABLE DECLARATIONS
///////////////////////////////////////////////////////////

// HTML content that will be written on the layer
var content = "";

// REL_ID of the selected node in navigation tree
var rel_id_selected = "";

// Start of the address that will be placed on links
var URLHeader = "";

// string that stores javascript commands to be generated
// and interpreted at runtime using
// eval(restoreImageString). Is used to restore
// highlighted images to original ones,
// when users moves mouse out of a menu
// image, on second part.
var restoreImageString = "";

// used on second part code to call a function
// to restore the menu after some miliseconds
var restoretimeout = "";

// position (x, y) for each layer
var pos_x = 100;
var pos_y = 100;

var imagePath = "";

var locale = "";

var timeout1;
var timeout2;
var timeouttime = (ns4?500:10);

var restoretimeout = "";

// maximum number of submenu itens before spliting
// the submenu in two columns
var maxsubmenuitens = 8;

///////////////////////////////////////////////////////////
//	URL MAKER FUNCTION
///////////////////////////////////////////////////////////

function makeURL(id)
{
	return (URLHeader+"Mediator?id="+id);
}

///////////////////////////////////////////////////////////
//	ITEM CLASS DECLARATION
///////////////////////////////////////////////////////////
//
//	This class is the base of the datastructure that
//	stores navigation trees. Subitem propertie stores
//	an array of Item objects.
//
///////////////////////////////////////////////////////////

function Item(name, linkstring, rel_id, subitem)
{
	this.name=name;
	this.linkstring=linkstring;
	this.rel_id=rel_id;
	this.subitem=new Array();
}

///////////////////////////////////////////////////////////
//	MENUITEM CLASS DECLARATION
///////////////////////////////////////////////////////////
//
//	This class is the base of the datastructure that
//	stores navigation trees on topnav menus. Subitem
//	propertie stores an array of MenuItem objects.
//
///////////////////////////////////////////////////////////

function MenuItem(name, linkstring, subitem)
{
	this.name=name;
	this.linkstring=linkstring;
	this.subitem=new Array();
}

///////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////
//
//	1ST PART: STATIC MENU
//
///////////////////////////////////////////////////////////
///////////////////////////////////////////////////////////
//
//	For example, this is a well-formed
//	Javascript code that must be declared
//	BEFORE calling the write("") function:
//
//	<script>
//		var item = new Array();
//		item[0] = new Item("Delrin