|
|
Posted by Jonathan on 01/05/07 21:15
Jonathan,
Is there anything special that I need to do to view your example? I
saved your code (as an new html file) and attempted to view it to no
avail. What would you suggest me to do to view your example. Thanks
for your assistance.
Jonathan
Jonathan N. Little wrote:
> Toby Inkster wrote:
> > Jonathan wrote:
> >
> >> Currently the code below allows the users to the drill down one level,
> >> but I want it to be able to drill down an additional level. Any help
> >> would be much appreciated.
> >
> > This looks startlingly like an old script of mine.
> >
> > I've not tried it with three nav levels, but I *believe* the key is to
> > replace this:
> >
> > subs = menu.childNodes();
> >
> > with this:
> >
> > subs = menu.getElementsByTagName('LI');
> >
>
> I did up a demo for someone here recently that is a little more modern
> for attaching the events and degrades to a fully expanded list if
> JavaScript is disabled
>
> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
> "http://www.w3.org/TR/html4/strict.dtd">
> <html>
> <head>
> <title>template</title>
> <style type="text/css">
> #sm1,#sm2,#sm3 {
> display: block;
> }
> </style>
>
> <script type="text/javascript">
> var buf='<style type="text/css">#sm1, #sm2, #sm3 { display: none;
> }</style>';
> document.write(buf);
> </script>
>
> <script type="text/javascript">
>
> var menus=new Array('m1', 'm2', 'm3');
>
> function toggle(e){
> var me;
> if(!e) var e=window.event;
> if(e.target) me=e.target; // W3C
> else if(e.srcElement) me=e.srcElement; // MSIE
> if(me.nodeType == 3) me=me.parentNode; // Safari bug on elements
> with TEXT
>
> var id='s' + me.id;
> var submenu=document.getElementById(id);
> me.flag =! me.flag;
> if(me.flag) submenu.style.display="block";
> else submenu.style.display="none";
> }
>
> function initMenus(){
> for( var i=0; i<menus.length; i++){
> var menu=document.getElementById(menus[i]);
>
> //alert('Init ' + menus[i] + ' which is ' + menu.tagName );
>
> menu.flag=false;
>
> if(menu.addEventListener){
> menu.addEventListener('click', toggle, false);
> }
> else if(menu.attachEvent){ //MS IE support
> menu.attachEvent('onclick', toggle);
> }
> }
> }
>
> // attach event after page loads
> if( window.addEventListener ) {
> window.addEventListener('load',initMenus,false); //legacy
> } else if( document.addEventListener ) {
> document.addEventListener('load',initMenus,false); //proper
> } else if( window.attachEvent ) {
> window.attachEvent("onload", initMenus); //IE only
> }
>
> </script>
>
> </head>
> <body>
>
> <ul>
> <li><a href="#" id="m1">Menu 1</a>
> <ul id="sm1">
> <li>Submenu 1.1</li>
> <li>Submenu 1.2</li>
> <li>Submenu 1.3</li>
> </ul>
> </li>
> <li><a href="#" id="m2">Menu 2</a>
> <ul id="sm2">
> <li>Submenu 2.1</li>
> <li>Submenu 2.2</li>
> <li>Submenu 2.3</li>
> <li>Submenu 2.4</li>
> </ul>
> </li>
> <li><a href="#" id="m3">Menu 3</a>
> <ul id="sm3">
> <li>Submenu 3.1</li>
> <li>Submenu 3.2</li>
> </ul>
> </li>
> <ul>
>
> </body>
> </html>
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIO
> http://www.LittleWorksStudio.com
[Back to original message]
|