/**********************************************************
Author:
Adam Barry
eBOUND
www.ebound.dk

Date: June 12 2007

© 2007 Adam Barry, all rights reserved
-----------------------------------------------------------

Name:
dropDownNav script

-----------------------------------------------------------
Description:
Function that enables drop-down navigation functionality by
the use of a standard compliant list-based navigation
structure with drop-down functionality in IE, Firefox,
Opera, Safari etc.

-----------------------------------------------------------
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
classname, according to the example below.

-----------------------------------------------------------
Example:
<script type="text/javascript" src="dropDownNav.js"></script>

<ul class="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>

-----------------------------------------------------------
Dependencies:
This script depends on the windowOnLoad-script to execute

**********************************************************/

function dropDownNav () {
	if (!document.getElementsByTagName) return;

	var navs = new Array();
	var lists = document.getElementsByTagName("ul");

	for (var i = 0; i < lists.length; i++) {
		if (lists[i].className.indexOf('navigation') == 0) {
			navs.push(lists[i]);
		}
	}

	for (var t = 0; t < navs.length; t++) {

		var togglers = navs[t].getElementsByTagName("LI");
		for (var i=0; i < togglers.length; i++) {
			togglers[i].onmouseover=function() {
				this.className+=" stretch";
			}
			togglers[i].onmouseout=function() {
				this.className=this.className.replace(new RegExp("stretch\\b"), "");
			}
		}
	}
}
addLoadEvent(function(){dropDownNav();});