Webuser Forums: Drop down Menu

You can try something a little more complex

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 
Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Javascript Sort Test</title>
</head>
<script type="text/javascript" >
//<![CDATA[
var direction = 1
var menuItems
function menuItem(href, linkText) {
    this.href = href;
    this.linkText = linkText;
}
function sortByLinkText(a, b) {
    var x = a.linkText.toLowerCase();
    var y = b.linkText.toLowerCase();
    return ((x < y) ? -direction : ((x > y) ? direction : 0));
}
function sort(id,dir){
	var menuItems = new Array();
	if (dir==null||dir=='asc')direction=1;
	if (dir=='desc')direction=-1;
	var ul = document.getElementById(id);
	var list = ul.getElementsByTagName('li');
	var arr = new Array(list.length);
	for(var i=0;i<list.length;i++){
		menuItems[menuItems.length++] = new menuItem(list[i].childNodes[0].href, 
list[i].childNodes[0].innerHTML);
	}
	menuItems.sort(sortByLinkText);
	for(var i=0;i<menuItems.length;i++){
		list[i].childNodes[0].innerHTML  = menuItems[i].linkText;
		list[i].childNodes[0].href  = menuItems[i].href;
	}
	if(direction==1){
		document.getElementById('asc').style.fontWeight='bold';
		document.getElementById('desc').style.fontWeight='';
	}else{
		document.getElementById('desc').style.fontWeight='bold';
		document.getElementById('asc').style.fontWeight='';
	}
}
//]]>
</script>
<body>
<a href="javascript:void(0)" onclick="sort('menu','asc')" id="asc" >Asc</a>
 | <a href="javascript:void(0)" onclick="sort('menu','desc')" id="desc">Desc</a>
<ul id="menu">
  <li><a href="http://www.yetanotherreviewsite.co.uk">Yet Another Review Site</a></li>
  <li><a href="http://www.webuser.com">WebUser</a></li>
  <li><a href="http://www.google.com">Google</a></li>
  <li><a href="http://www.yahoo.com">Yahoo</a></li>
  <li><a href="http://www.betanews.com">Betanews</a></li>
  <li><a href="http://www.ragesrenegades.co.uk">Rages Renegades</a></li>
</ul>
<script type="text/javascript" >sort('menu','asc')</script>
</body>
</html>
--------------------
Andrzej 'Daverage' Marczewski