Click to See Complete Forum and Search --> : expandable menu


Julie Moriarity
09-22-2003, 11:51 AM
I am trying to find a good-looking menu that is ADA compliant and user friendly. An expandable menu, text, to be used with CSS. One that works accross platform and on all current browsers. Any suggestions?

Charles
09-22-2003, 11:57 AM
Originally posted by Julie Moriarity
I am trying to find a good-looking menu that is ADA compliant and user friendly. An expandable menu, text, to be used with CSS. One that works accross platform and on all current browsers. Any suggestions? No such thing does or can exist. The trick is to make sure that the page works when the dynamic menu does not. The easiest method is to make sure that the root menu options are real, not drawn by JavaScript and pointing toward a page containing the links that cannot be displayed.

Julie Moriarity
09-22-2003, 01:14 PM
Here is an example of what I would like to have--I'm not sure how this is done.

http://rpp.missouri.edu/

"the resources menu"

Charles
09-22-2003, 01:50 PM
I'm guessing that you are referring to the "Resources For" menu and I'm guessing because it isn't working on my browser even when I turn JavaScript on. And it's not accessible with all those JavaScript links. In fact, that page is profoundly inaccessible.

Xin
09-22-2003, 05:56 PM
try my Rule #1: View Source.

well, here goes a simple case:


<a href="javascript://" onclick="switchUl('menu1');">Business</a>
<span style="display:block;" id="menu1">
&nbsp;&nbsp;&nbsp;<a href="/business/books.html">Books</a><br />
&nbsp;&nbsp;&nbsp;<a href="/business/links.html">Links<br />
</span>

<script type="text/javascript">
function switchUl(id){
if(document.getElementById){
a=document.getElementById(id);
a.style.display=(a.style.display!="none")?"none":"block";
}
}

// the following lines are to deal with browsers that don't support getElementById and style.display
// the menu IDs should match the ones you call with switchUl()
var aryMenu = new Array ("menu1","menu2","menu3","menu4","menu5","menu6","menu7","menu8","menu9");
for(i=0;i< aryMenu.length;i++){
switchUl(aryMenu[i]);
}
</script>