Adam's Advanced HTML Guide- Intro to DHTML

Dhtml, like CSS, is a new and emerging technology that will eventually be very popular as time goes by. With DHTML, portions of your page can change on demand, without the need to reload the document. Virtually every aspect of the page can be changed, such as page styles, the visibilty of elements, the position of images, text etc. It's a great technology that will for sure revolutionize the web as we know it!

leaf.gif (1184 bytes) A little background

DHTML was first introduced in NS 4, although it's implementation was quite buggy, and deviated greatly from the proposed DHTML technology of W3C. When IE 4 came out, it supported a more complete model of DHTML, and is considered to be superior to that of Netscape's. The below demonstrates two DHTML examples, one for IE 4, and one for NS 4. The first script was obtained from Dynamic Drive, a great DHTML code library site:

DHTML example #1 (Dragable elements script)
This example demonstrates the use of DHTML to enable any image to be dragable. If you're using IE 4, just drag the image with your mouse- it will follow!

police.gif (1685 bytes)

DHTML example #2 (Dynamic messages)
This example uses the dynamic capabilities of IE4+ and NS4+ to create a changing message display that changes the text inside of it every few seconds:

leaf.gif (1184 bytes) Recomended further reading

Dynamic Drive DHTML code library
A DHTML lover's dream come true, this site contains hundreds of free, original DHTML scripts. I've used many of their scripts on this site, including the cool script in the frontpage that highlights each table cell as the mouse moves over it in IE 4. You don't want to miss this site.


Recommended resources