Show only one div at any one time

Posted under » JavaScript on 8 September 2010

header. With the option of closing the box if needed.

function showonlyone(thechosenone) {
      var newboxes = document.getElementsByTagName("div");
            for(var x=0; x < newboxes.length; x++) {
                  name = newboxes[x].getAttribute("name");
                  if (name == 'newboxes') {
                        if (newboxes[x].id == thechosenone) {
                        newboxes[x].style.display = 'block';
                  }
                  else {
                        newboxes[x].style.display = 'none';
                  }
            }
      }
}

function cloze(thechosenone) {
      var newboxes = document.getElementsByTagName("div");
            for(var x=0; x < newboxes.length; x++) {
                  name = newboxes[x].getAttribute("name");
                  if (name == 'newboxes') {
 
                        newboxes[x].style.display = 'none';
            }
      }
}

Body

   

      

         

            collapse
         
         

         

         Div #1
      
      

         

            collapse
         
         

         

         Div #2
      

         

            collapse
         
         

         

         Div #3
   

For more hide and show script, please see previous post.