Friday, August 04, 2006

How To: Blogger Navbar Toggle Script

The Blogger navigation bar is handy but I wanted the ability to turn it off or on if I wanted to, so I wrote up this javascript to toggle the navbar on or off.

<script language="javascript" type="text/javascript">
<!--
function toggle(targetId) {
  if (document.layers) {
    visi = (document.layers[targetId].visibility == 'show') ? 'hide' : 'show'
    document.layers[targetId].visibility = visi;
  }
  else if (document.all)
    visi = (document.all[targetId].style.visibility == 'visible') ? 'hidden' : 'visible';
    document.all[targetId].style.visibility = visi;
  }
  else if (document.getElementById) {
    visi = (document.getElementById(targetId).style.visibility == 'visible') ? 'hidden' : 'visible';
    document.getElementById(targetId).style.visibility = visi;
  }
}
// -->
</script>


To use it I just added an 'onclick' event to a link:

<a href="#" onclick="toggle('b-navbar');" style="font-weight: bold;">Toggle Navbar</a>


It is generic enough that you could link it to any event and pass it the id of any element you want to toggle.

0 Comments:

Post a Comment

<< Home