Friday, July 02, 2004

Navigation - Show/Hide

I needed to create a show/hide menu navigation for a document being posted on the site. The old script was a bit clunky and required quite a bit of work on my part to implement. I went ahead and wrote a newer script that is much more modular and requires little extra work when used on a page. The new JS file includes documentation and sample. A quick overview:
  • Additional code required for use: divs around menu and each document section (id for the section divs should match the anchor links in the menu)
  • attach JS file to document
  • attach stylesheet to the document with a few required entities
The script is "non-destructive" … it shouldn't affect any other scripts on a page. I made the function, variable, and CSS names pretty unique and the onload statement is done using the "addeventlistener" method (which requires a DOM-capable browser … but that's less of an issue than it used to be).