Javascript code not working fine in IE8.

[Gaurav Pruthi]

I have embedded a sidebar menu in the web page , Although it is working fine with Mozilla firefox , but in IE8 I am facing problem what is happening is :

- I am not able to select submenu item options in IE8( It disappears as
soon as I point cursor on it).
- When I select a menu item having a number of submenu items. then a
space is created between menuitems vertically which look awkward.

But when I tried on firefox8.0 , it is working fine.

Here is the code snippet of javascript :

    <script type="text/javascript">

    //Nested Side Bar Menu (Mar 20th, 09)
    //By Dynamic Drive: http://www.dynamicdrive.com/style/

    var menuids=["sidebarmenu1"]; //Enter id(s) of each Side Bar Menu's main UL, separated by  commas

    function initsidebarmenu(){
    for (var i=0; i<menuids.length; i++){
    var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul");
    for (var t=0; t<ultags.length; t++){
    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle";
	
    if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu
    ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px"; //dynamically position first 

    else //else if this is a sub level submenu (ul)
    ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px";

    //position menu to the right of menu item that activated it
    ultags[t].parentNode.onmouseover=function(){
    this.getElementsByTagName("ul")[0].style.display="block";
    }
    ultags[t].parentNode.onmouseout=function(){
    this.getElementsByTagName("ul")[0].style.display="none";
    }
    }
    for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use  "display:none" 
    ultags[t].style.visibility="visible";
    ultags[t].style.display="none";
    }
    } 
    }

    if (window.addEventListener)
    window.addEventListener("load", initsidebarmenu, false);
    else if (window.attachEvent)
    window.attachEvent("onload", initsidebarmenu);

    </script>

The corresponding menu items are :

     <div class="sidebarmenu">
     <ul id="sidebarmenu1">
     <li><a href="#">Checklist>> </a>
     <ul>
     <li><a href="#">Create</a></li>
     <li><a href="#">Verify</a></li>
     <li><a href="#">Approve</a></li>
     </ul>
     </li>
     <li><a href="#">Status of Review</a></li>

     <li><a href="#">Generate Report</a></li>

     </ul>

     </div>

Will appreciate any help in this regard.

thanks.

[acoder]

First thing to do is test the demo page of this script in IE8 from DD's website.

[Gaurav Pruthi]

@acoder
Hi,
I have tried the demo on :

http://www.dynamicdrive.com/style/csslibrary/item/nested_side_bar_menu/

there it is working fine..