DHTML article deconstructed
Create Pop-Up Notes with DHTML is a disappointing new article on SitePoint which describes a technique for having a yellow Post-It style note appear when a link is clicked. The example given is for a link that shows the un-abbreviated form of NASA—a task better accomplished using the
acronym tag. In addition, I spotted the following problems with the article:
- The link that triggers the popup note uses
onclickis the preferable alternative.
- Although the effect uses both CSS and a
divelement, the example code still recommends formatting the popup note using a fixed width table. This could be replaced by CSS styles on the
div—a yellow background, some padding and a width declaration.
- The code uses
display: nonehas better browser support and would have the same end effect (the code would then need to toggle it to
display: blockto make the note visible).
document.allto reference the specified div by default, with object detection used to provide support for Netscape 4 (shudder) and Netscape 6/Mozilla.
document.allwas only ever used by IE, and IE5 and above support the standards compliant DOM equivalent,
document.getElementById(which is also used by Mozilla). The only reason to use document.all is if you desperately need to support IE4, a browser who’s market share is even less than Netscape 4.