Όταν κάνω κλικ σε κάποιο menu να κλείνουν τα υπόλοιπα

dimitris212 · 10 Οκτωβρίου 2013

Καλημέρα σας,

θα μπορούσατε να με βοηθούσατε στο παρακάτω?

πως γίνεται πχ όταν πατάω ένα menu να κλείνουν τα υπόλοιπα?

CSS:

<style> 
#sitemap, #sitemap ul, #sitemap li{ 
   margin:0; 
   padding:0; 
   list-style:none; 
} 
#sitemap{background:url(../images/line1.gif) repeat-y;} 
#sitemap li{ 
   line-height:20px; 
   margin-top:1px; 
   position:relative; 
   width:100%; 
} 

#sitemap li a { 
   color: #000; 
   font-weight: bold; 
} 

#sitemap li a:hover { 
   color: #439c40; 
   text-decoration: none; 
} 

/* IE leaves a blank space where span is added so this is to avoid that */ 
* html #sitemap li{ 
   float:left; 
   display:inline; 
} 

#sitemap li a{padding-left:28px;} 
#sitemap li span{float:left;position:absolute;top:5px;left:5px;width:13px;height:13px;cursor:auto;font-size:0;} 
#sitemap li span, #sitemap li span.collapsed{background:url(http://www.mixhost.gr/collapsed.gif) no-repeat 0 0; cursor: pointer;} 
#sitemap li span.expanded{background:url(http://www.mixhost.gr/expanded.gif) no-repeat 0 0;} 

/* sub levels */ 

#sitemap li ul{    
   margin-left:15px; 
   background:url(line1.gif) repeat-y; 
} 
#sitemap li li{    
   background:url(line2.gif) no-repeat 0 0; 
} 

/* etc. */ 

/* float fix */ 

#sitemap:after, #sitemap ul:after{ 
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden; 
} 
#sitemap, #sitemap ul{display:block;} 
/*  \*/ 
#sitemap, #sitemap ul{min-height:1%;} 
* html #sitemap, * html #sitemap ul{height:1%;} 
 /*  */ 
#sitemap ul{display:none;} 
</style>

JS:

<script> 
this.sitemapstyler = function(){ 
   var sitemap = document.getElementById("sitemap") 
   if(sitemap){ 
       
      this.listItem = function(li){ 
         if(li.getElementsByTagName("ul").length > 0){ 
            var ul = li.getElementsByTagName("ul")[0]; 
            ul.style.display = "none"; 
            var span = document.createElement("span"); 
            span.className = "collapsed"; 
            span.onclick = function(){ 
               ul.style.display = (ul.style.display == "none") ? "block" : "none"; 
               this.className = (ul.style.display == "none") ? "collapsed" : "expanded"; 
            }; 
            li.appendChild(span); 
         }; 
      }; 
       
      var items = sitemap.getElementsByTagName("li"); 
      for(var i=0;i<items.length;i++){ 
         listItem(items[i]); 
      }; 
       
   };    
}; 

window.onload = sitemapstyler; 
</script>

html:

<body> 
<ul id="sitemap"> 
         <li><a href="#">First link</a> 
            <ul> 
               <li><a href="#">Second link</a> 
                  <ul> 
                     <li><a href="#">Third link</a> 
                            <ul> 
                        <li><a href="#">Fourth link</a></li> 
                            </ul> 
                  </ul>                      
               </li> 
            </ul>                
         </li> 
            <li><a href="#">New First link</a> 
            <ul> 
               <li><a href="#">New Second link</a> 
                  <ul> 
                     <li><a href="#">New Third link</a> 
                            <ul> 
                        <li><a href="#">New Fourth link</a></li> 
                            </ul> 
                  </ul>                      
               </li> 
            </ul>                
         </li>          
      </ul> 
</body> 
</html>

Σύνδεση

Όταν κάνω κλικ σε κάποιο menu να κλείνουν τα υπόλοιπα

Προτεινόμενες αναρτήσεις

dimitris212

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Δημιουργία λογαριασμού

Σύνδεση

Σύνδεση