The Sysadmin Notebook  

Sitemap

Example: Accessing the style collection

Contact Details

Awesome Web Production Company
Going Nowhere Lane 0
Catch 22
N4 2XX
England

The address element has its 'style.display' property set to none in the page script and then an event is added to the 'collapseLink' element to toggle the style. 

sc = {
  init:function() {
    sc.head = document.getElementsByTagName('h3')[0];
    if (!sc.head) { return; }
    sc.ad = DOMhelp.closestSibling(sc.head,1);
    sc.ad.style.display = 'none';
    var t = DOMhelp.getText(sc.head);
    var collapseLink = DOMhelp.createLink('#',t);
    sc.head.replaceChild(collapseLink, sc.head.firstChild);
    DOMhelp.addEvent(collapseLink,'click',sc.peekaboo,false);
  },
  peekaboo:function(e) {
    sc.ad.style.display = sc.ad.style.display == 'none' ? '' : 'none';
  },
}
DOMhelp.addEvent(window,'load',sc.init,false);

Apparently, this is poor practice, because it uses javascript to apply styling - when this is a job for CSS.