DHTML Show/Hide script written by Mark Wilton-Jones - 2001

Please see http://www.howtocreate.co.uk/jslibs/ for details of this script
Please see http://www.howtocreate.co.uk/jslibs/termsOfUse.html for terms of use

To use:

Inbetween the <head> tags, put:

	<script type="text/javascript" language="javascript1.2">
	//this is optional and therefore does not need to be defined if unwanted
	<script src="PATH TO SCRIPT/showhide.js" type="text/javascript" language="javascript1.2"></script>

if you haven't got an alternative (You should have one for all those people out there who can't
use JavaScript anyway . . .), simply omit the line defining var myalternative;

Now create the bits that you want to show and hide (only one will be shown at a time):

	<div id="ID OF DIV" style="position:absolute;left:20px;top:25px;visibility:hidden;">
		contents go in here

You can change the numbers after the 'left:' and 'top:' bits to position it on the page

To show a div, put:

	<a href="javascript:showdiv('ID OF DIV');" onmouseover="showdiv('ID OF DIV')">Link words</a>

DO NOT leave out the " and ' bits.

To hide the div that is showing, put:

	<a href="javascript:hidediv();" onmouseover="hidediv()">Link Words</a>

If a new div is being displayed, the old one will be hidden anyway.

                               And here's the actual code

//You will notice that I never actually detect the browser type, I just
//detect its capabilities and then use them. This means that if someone
//uses a browser that I don't know, but is able to use either method, it
//will still work.

window.onerror = null;

//initialise all variables

var olddiv = 0;   //this will become a reference to the object that is being shown or was last shown
                  //in all cases, the object that is shown/hidden will be a <div ..> element

function getRefToDivNest( divID, oDoc ) {
	if( !oDoc ) { oDoc = document; }
	if( document.layers ) {
		if( oDoc.layers[divID] ) { return oDoc.layers[divID]; } else {
			for( var x = 0, y; !y && x < oDoc.layers.length; x++ ) {
				y = getRefToDivNest(divID,oDoc.layers[x].document); }
			return y; } }
	if( document.getElementById ) { return document.getElementById(divID); }
	if( document.all ) { return document.all[divID]; }
	return document[divID];

function showdiv(thisdiv) {
	//this function shows the div
	hidediv(); //first, hide the last one
	//Convert the name of the div into a reference to it. Basically, get a reference to the object
	olddiv = getRefToDivNest(thisdiv);
	if( !olddiv ) {
		//Nothing found. This browser is not compliant with any!
	//Make the object visible
	if( olddiv.style ) {
		//DOM compliant
		olddiv.style.visibility = 'visible';
	} else {
		if( olddiv.visibility ) {
			//Netscape and old versions of Mozilla compliant
			olddiv.visibility = 'show';
		} else {
			//Nothing found, no known way of changing the style
	divshown = 1;

function hidediv() {
	if( olddiv ) {
		if( olddiv.style ) {
			//DOM compliant
			olddiv.style.visibility = 'hidden';
		} else {
			//Netscape and old versions of Mozilla compliant
			olddiv.visibility = 'hide';
		//No need for else notifyFail()
		//If it was going to fail, it would have failed while it was being shown
	olddiv = false;

function notifyFail() {
	//oops, I guess nothing works in this browser
	if( window.myalternative ) {
		if( window.confirm( "You are having problems displaying some components of this page.\n"+
			"\nWould you like to try the other page design?" ) ) { location.href = myalternative; }
	} else {
		window.alert( "You are having problems displaying some components of this page.\n\n"+
			"Sorry, but there is not yet an alternative page." );