// JavaScript Document
/*
Welcome to the CHOT:
Chris Holland Outline Toolbox
This is a work in progress
 
For more info:
frenchy@gmail.com
http://chrisholland.blogspot.com/
 
Copyright Chris Holland 2004-2005
Some rights reserved under a Creative Commons License:
Share-alike, with Attribution, do whatever you want with it beyond that :)
http://www.creativecommons.org/
 
====================================================================================
Modified script in accordance with to validate the standards of the W3C (Strict 1.0)
Flavio Theruo Kaminisse
http://www.japs.etc.br
http://creativecommons.org/licenses/by-nc-sa/2.0/br/deed.en
http://creativecommons.org/licenses/by-nc-sa/2.0/br/
 
*/
 
/* start basic stuff */
 
function isWithinNode(e,i,c,t,obj) {
answer = false;
te = e;
while (te && !answer ) {
if	( (te.id && (te.id == i)) || (te.className && (te.className == i+"Class"))
|| (!t && c && te.className && (te.className == c))
|| (!t && c && te.className && (te.className.indexOf(c) != -1))
|| (t && te.tagName && (te.tagName.toLowerCase() == t))
|| (obj && (te == obj))
) {
answer = te;
} else {
te = te.parentNode;
}
}
return te;
}//isWithinNode
 
function getEvent(event) {
return (event ? event : window.event);
}//getEvent()
 
function getEventElement(e) {
return (e.srcElement ? e.srcElement: (e.target ? e.target : e.currentTarget));
}//getEventElement()
 
/* end basic stuff */
 
function handleClick(event) {
e = getEvent(event);
eL = getEventElement(e);
if ( listItem = isWithinNode(eL,null,null,"li",null) ) {
processListItem(listItem);
}//if we clicked on a list item
}//handleClick
 
function processListItem(liObj,isInitMode) {
childList = liObj.getElementsByTagName("ol");
if ( !childList || (childList.length == 0) )
childList = liObj.getElementsByTagName("ul");
if ( childList )
childList = childList[0];
if ( childList) {
currentDisplay = childList.style.display;
if ( !currentDisplay || (currentDisplay == "block") ) {
if ( isInitMode && !(childList.className == "compact") )
showAsExpanded(liObj,childList);
else
showAsCompact(liObj,childList);
} else {
if ( isInitMode )
showAsCompact(liObj,childList);
else
showAsExpanded(liObj,childList);
}
}
}//processListItem
 
function showAsCompact(liObj, childList) {
childList.style.display = "none"
childList.setAttribute("class","compact");
//liObj.firstChild.className = "chot_compactHeader";
setClass(liObj.firstChild,"chot_compactHeader");
liObj.className="chot_compact";
//setClass(liObj,"chot_compact");
}//showAsCompact
 
function showAsExpanded(liObj, childList) {
childList.style.display = "block";
childList.removeAttribute("class");
//liObj.firstChild.className = "chot_expandedHeader";
setClass(liObj.firstChild,"chot_expandedHeader");
liObj.className = "chot_expanded";
//setClass(liObj,"chot_expanded");
}//showAsExpanded
 
function setClass(o,v) {
c = o.className;
 
bc = new Array();
var j=0;
var i=0;
if (c) {
c = c.split(" ");
for ( i = 0; c[i]; i++ ) {
if ( c[i].indexOf("chot_") == -1 ) {
bc[j] = c[i];
j++;
}
}
bc = bc.join(" ");
o.className = bc + " " + v;
}//class set on element
}//setClass
 
function initOutlines() {
listItems = document.getElementsByTagName("li");
for ( i = 0; listItems[i]; i++ ) {
processListItem(listItems[i],true);
}
 
}//initOutlines
 
if ( document.addEventListener ) {
document.addEventListener("mouseup", handleClick, false);
window.addEventListener("load", initOutlines, false);
} else {
document.onmouseup = handleClick;
window.onload = initOutlines;
}

<script src="xoxo.js"><!--mce:0--></script>
<ul class="xoxo">
	<li class="chot_compact">MENU
<ul class="compact">
	<li>Link 01</li>
	<li>Link 02</li>
	<li>Link 03</li>
</ul>
</li>
</ul>