Folder Tree submenu not functioning properly

Hello everyone,

I have been working on a folder tree and have it just about completed. The only issue that I have is that the sub-menu does not function properly. When I open it and then click on one of the main menu options and then go back to the sub-menu it is still open. What should happen is that it closes when any other main menu option is clicked. Could someone review the code below and help me to understand what I need to do? Thanks.


<!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><title>

</title>
 
 <script src="jquery/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
 <script src="jquery/jquery-1.4.1.js" type="text/javascript"></script>
 
 
 <script type="text/javascript">

 function display(obj) {
  //collapse all div tags with ids

  $("div[id!=''][id!='" + obj.id + "']").each(function(i, obj) {

  var parent = $(obj).parent();
  var div2 = $(parent).find("div")[1];

     
  $(div2).slideUp("fast");
  var div1 = $(parent).find("div")[0];
  var img = $(div1).find("img")[0];
  $(img).attr("src", "images/closedfolder.gif");
    
  });


  
 var parent = $(obj).parent();
 var div2 = $(parent).find("div")[1];
 $(div2).slideToggle("fast");
 var div1 = $(parent).find("div")[0];
 var img = $(div1).find("img")[0];
 if ($(img).attr("src") == "images/closedfolder.gif") {
  $(img).attr("src", "images/openfolder.gif");
 
   
  }
 else {
  if ($(img).attr("src") == "images/openfolder.gif")
  { $(img).attr("src", "images/closedfolder.gif"); }
 }

 
 }

 //Submenu

 function ShowHide(){ 
 $("#wuc").animate({"height": "toggle"}, { duration: 150 });
if ($("#wuc_image").attr("src") == "images/closedfolder.gif") {
  $("#wuc_image").attr("src", "images/openfolder.gif");
 
   
  }
 else {
  if ($("#wuc_image").attr("src") == "images/openfolder.gif") {
  $("#wuc_image").attr("src", "images/closedfolder.gif");}
 
 }

 
 } 


 </script>
 <style type="text/css">
 body 
 {
 color:navy;font-family:Arial Narrow;
 }
 </style>

</head>
<body style="margin:0;padding:0;margin-left:10px;">
 <form name="directions" method="post" action="" id="directions">

<div><br><br>  
 <div>
 <div style='cursor:pointer;' onclick='display(this)' id='DrivingDirections'>&nbsp;&nbsp;* Driving Directions</div>
 <div style='display:none;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.google.com'>- Google</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.msn.com'>- MSN</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.yahoo.com'>- Yahoo</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a style='text-decoration:none; color:navy;' onclick='ShowHide(); return false;' href='#'>&nbsp;&nbsp;* WUC</a>  
<div id='wuc' style='display:none;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 <a target='_blank' href='http://www.test.com'>- Test1</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test2</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test3</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test4</a><br/><br/>
  </div>
 </div>
 
 </div> 

 <div>
 <div style='cursor:pointer;' onclick='display(this)'id='CampusMaps'>&nbsp;&nbsp;* Campus Maps</div>
 <div style='display:none;'>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test5</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test6</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  <a target='_blank' href='http://www.test.com'>- Test7</a><br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
 </div>
 
 </div>
</div>

 

 </form>
</body>
</html>

Folder Tree submenu not functioning properly

missladyy

whoisgregg

missladyy

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week