// This Javascript consists of
//PART1 declarations, browser check DO NOT CHANGE
//PART2 declaration of the layerinput() function. DO NOT CHANGE
//PART3 declaration of don() function, the one that is called by an eventhandler and displays the layer using data from previous functions
//and the event handler value set to the function. DO NOT CHANGE
//PART4 declaration of doff() function. This one turns off the layer, it is called by another eventhandler DO NOT CHANGE
//PART5 Array of attributes, using layerinput(), assigned to the object link[x], where x is the number
//changes to what the layer will display, and how many layers u will have should be done here. Always in ascending order the link[x] objects.
//Only change the attributes inside the parens. format should be always: inputlayer('TEXT',#,#)
//PART6 to avoid confusion and faulty script operation, I am including the necessary HTML tags <layer> (for netscape) <div> for IE
//these tags can alter the size of the layer, change the percentage value according to your needs

//IMPORTANT!!
//DO NOT CHANGE ANYTHING FROM PART 1 THRU PART4

// This js file includes everything necessary to run the code.
//HOWEVER
//To Activate the function, use OnMouseOver="don(x)"
//where x is any positive integer starting from 0 for the first item you wish
//to display a division or layer for.
//use OnMouseOut="doff()" to hide the layer again.



<!-- Hiding
//PART1
//Browser Version check. It is needed because Internet Explorer
//uses division tag for display. Netscape uses layer
//tag for display

var bname=navigator.appName;
var bversion=parseInt(navigator.appVersion)
if (bname=="Netscape")
var brows=true
else
var brows=false
var x=0;
var link=new Array();

//PART2
//Display function declaration, its attributes.

function layerinput(msg,dtop,dleft){
this.msg=msg;
this.dtop=dtop;
this.dleft=dleft;
}

//PART3
//Function that turns on the layer or division. Event handlers invoke the function
//don() with the attribute set (0, 1, 2, 3, etc.) The function passes the value to x in the "with" attribute (link[x])
//The with() function sets the object link[x] as the "default" object,  which depending on the vlaue of x, will
//contain the data of the corresponding layerinput() function
//the attributes of the layerinput() function are then assigned to the default layer or division object.
//It then adds visibility to it. Thus the layer is shown, with the desired attributes.

function don(x)
{
if ((bname=="Netscape" && bversion>=4) || (bname=="Microsoft Internet Explorer" && bversion>=4))
	{
	//Netscape layer code
	if (brows)
		{
		with(link[x])
			{ 	
			document.layers['linkex'].document.writeln(msg);
			document.layers['linkex'].document.close();
			document.layers['linkex'].top=dtop;
			document.layers['linkex'].left=dleft;
			}
		document.layers['linkex'].visibility="show";
		}
	//Internet Explorer division code
	else
		{
		with(link[x])
			{
			divisionex.innerHTML=msg;
			divisionex.style.top=dtop;
			divisionex.style.left=dleft;
			}
		divisionex.style.visibility="visible";
		}
	}
}

//PART4
//function for turning of the layer/division

function doff()
{
if ((bname=="Netscape" && bversion>=4) || (bname=="Microsoft Internet Explorer" && bversion>=4))
	{
	if (brows)
	document.layers['linkex'].visibility="hide";
	else
	divisionex.style.visibility="hidden";
	}
}


//PART5 Array of attributes, assigned to the link[x] object
//msg attribute is the text written to the layer.
//dtop, dleft  attributes hold pixel numers, they set the top and left alignment of the layer

link[0]=new layerinput('<table border="1" width="300" cellpadding="2" bordercolor="3a6a4d" bgcolor="#FFFFFF"><tr><td><font face="Garamond, Arial, Helvetica, sans-serif"><b><ul><li class="main"><a href="GM_MutualFunds.htm">Mutual Funds</a></li><li><a href="GM_VariableAnnuity.htm">Tax-Deferred Variable Annuity</a></li><li><a href="GM_VariableUniversal.htm">Variable Universal Life</a></li></b></font></td></tr></table>',311,200)
link[1]=new layerinput('<table border="1" width="240" cellpadding="2" bordercolor="3a6a4d" bgcolor="#FFFFFF"><tr><td><font face="Garamond, Arial, Helvetica, sans-serif"><b><ul><li><a href="WI_Principals.htm">Principals</a></li><li><a href="Mission.htm">Mission Statement</a></li></b></font></td></tr></table>',573,200)

//link[2]=new layerinput('<table border="1" width="420" cellpadding="2" bgcolor="#D2E1FF"><tr><td><font //face="Verdana, Arial, Helvetica, sans-serif" size="2"><ul><li><a href="GM_MutualFunds.htm">Mutual //Funds</a></li><li><a href="GM_TaxDef.htm">Tax-Deferred Variable Annuity</a></li><li><a //href="GM_Variable.htm">Variable Universal Life</a></li></font></td></tr></table>',380,325)
//link[3]=new layerinput('<table border="1" width="420" cellpadding="2" bgcolor="#D2E1FF"><tr><td><font //face="Verdana, Arial, Helvetica, sans-serif" size="2">Provides centralized access to vital sales information like //price lists, product and coupon specifications, selling sheets, presentations, product images, retailer logos, //etc.; eliminates the need for most hard copy materials or CD-ROMs.</font></td></tr></table>',380,325)

//ORIGINAL CODE

//link[0]=new layerinput('<font face="Arial" size="5"  color="WHITE"><span
//style="background-color: rgb(0,0,0);">BLUE</span></font>',100,100)
//link[1]=new layerinput('<span style="background-color: rgb(0,0,0);"><font face="Arial" size="5" color="WHITE">GREEN</font><br><font size="3" face="arial" color="WHITE">Notice that you can also include an image in the layer, as with the one below this text</font></span><img src="building.gif">',300,600)

//PART6
//writing the division HTML tag, I do it here so that it is less confusing. You don't have to add separate HTML tags.
document.write("<div id=\"divisionex\" style=\"position:absolute; visibility: hidden; width=19%\">")
document.write("</div>")
//writing the layer code
document.write("<Layer name=\"linkex\" visibility=\"hide\" width=\"19%\">")
document.write("</layer>")
if (document.layers) { 
document.write('<link rel=stylesheet href="../css/homepage.css">') 
} 
else { 
document.write('<link rel=stylesheet href="../css/homepage.css">') 
}


// done hiding -->