/**********************************************************
Author:
Adam Barry
www.ebound.dk

Date: February 24 2006

© 2006 Adam Barry, all rights reserved
-----------------------------------------------------------

Name:
dropDownNav script

-----------------------------------------------------------
Description:
Function that simulates the "#navigation li:hover > ul" CSS
functionality available in FireFox, Opera etc. This enables
the use of a standard compliant list-based navigation
structure with drop-down functionality in IE, without the
need to modify the XHTML markup.

-----------------------------------------------------------
Usage:
Simply place a link to the this script in the head-section
of the XHTML page. The script will then automatically
execute on page load.

<script type="text/javascript" src="dropDownNav.js"></script>

Make sure that your list structure has "navigation" as ID,
according to the example below.

-----------------------------------------------------------
Example:
<script type="text/javascript" src="dropDownNav.js"></script>

<ul id="navigation">
	<li class='first'><a class='selected' href='default.htm'>Home</a></li>
	<li><a href='default.htm'>Page 2</a>
		<ul>
			<li><a class='first' href='default.htm'>Subpage 2.1</a></li>
			<li><a href='default.htm'>Subpage 2.2</a></li>
		</ul>
	</li>
	<li><a href='default.htm'>Page 3</a>
		<ul>
			<li><a class='first' href='default.htm'>Subpage 3.1</a></li>
			<li><a href='default.htm'>Subpage 3.2</a></li>
		</ul>
	</li>
</ul>

**********************************************************/

function dropDownNav () {
	if (document.all&&document.getElementById) {
		navRoot = document.getElementById("navigation");
		for (i=0; i<navRoot.childNodes.length; i++) {
			node = navRoot.childNodes[i];
			if (node.tagName=='LI') {
				node.onmouseover = function showElement() {
					for (i=0; this.childNodes[i]; i++) {
						if (this.childNodes[i].tagName == 'UL') {
							ulElement = this.childNodes[i];
							ulElement.style.display = "block";
						}
					}
				}

				node.onmouseout=function hideElement() {
					for (i=0; this.childNodes[i]; i++) {
						if (this.childNodes[i].tagName == 'UL') {
							ulElement = this.childNodes[i];
							ulElement.style.display = "none";
						}
					}
				}
			}
		}
	}
}

//window.onload = dropDownNav;