DHTML Exposed

This tutorial was presented to the ADUG on 19/02/2001 by Sarah Maguire

What is DHTML?

W3C says: "DHTML is the art of making HTML pages dynamic by using scripting to manipulate the style, layout and contents of the document."

Dynamic HTML describes HTML pages with dynamic content. A DHTML page combines three components:

These three components are stuck together with the Document Object Model (DOM) which specifies the objects inside a HTML document.

DHTML is simply a term to describe the combination of these three elements.

How To Create DHTML Documents

  1. An existing HTML document (dhtml_1.htm)
  2. Positioning, style and visibility to the elements (dhtml_2.htm)
  3. Scripting to create animation (dhtml_3.htm)

IE versus Navigator

The biggest difference between Internet Explorer and Netscape Navigator is the different Document Object Models used.

This raises the need for browser sniffer scripts:

Nav4=(document.layers)?1:0;
IE4=(document.all)?1:0;
ver4=(Nav4 || IE4)?1:0;

Navigator also handles events differently. This problem can be circumvented by adding JavaScript to a HREF section of an Anchor rather than the OnClick event:

< a href="javascript:slideLogo(0, 140);"> Slide Logo</a>

instead of:

< a nohref onclick=“slideLogo(0, 140);”> Slide Logo</a>