Dynamic HTML - it's easy!

... well, easier than Microsoft pretends it is, anyway.

DHTML Links

See error corrections!

My Sample DHTML Page


This month in my Publish and Be... Web authoring series, I've started looking at Dynamic HTML, a new system which lets you treat all the elements on a Web page (images, text etc) as programmable objects. Although both NetScape and Microsoft claim to have 'Dynamic HTML' support in their latest browsers, only Microsoft's IE 4 has the full 'Document Object Model' (DOM) which lets you manipulate page elements at will. For that reason I've concentrated on IE 4.

Microsoft's current online Dynamic HTML documentation isn't the most user-friendly I've ever seen (click here for links to online DHTML resources). It makes things seem more complicated than they really are, focussing heavily on Cascading Style Sheets and going into great detail about 'indexing collections' as a way of referencing variables. However it is getting better - even in the last couple of weeks since PC Plus went to print, it's gained about 30% more material, and a lot of the early stuff has been tidied up.

In fact it's really easy to get started with Dynamic HTML, without a style sheet or indexed collection in sight. In the magazine I've looked at some simple techniques you can use to make IMG tags, pushbuttons and text areas do things they've never been able to do before, and I've put them all together (along with a taster for next month's article) into a sample IE 4 Web page (shown right).

If you're running Internet Explorer 4.0, you can click here to view my sample Dynamic HTML page . Even if your browser can't handle the DHTML code, you might like to look at the source to see how it's done - I've tried to keep it as clear as possible. Also, you might like to click here to see corrections for the errors that appeared in Publish and Be..., issue 134. It's all square between me and the PC Plus production team this month, with one error each!

Finally, an important warning for all would-be Dynamic HTML authors - make sure your WYSIWYG authoring tool doesn't corrupt your DHTML code! This is a problem I had before with JavaScript, where authoring tools simply dropped my JS routines, and now, sadly, it seems to be happening with DHTML. For example, both WebExpress 2.03 and (more surprisingly) Microsoft FrontPage Express 2.0.2 render my sample DHTML page unuseable just by opening it, adding some text then saving it. As a result, my DHTML authoring tool of choice is currently Windows Notepad, a program which has never corrupted a DHTML routine yet! Let's hope the authoring tools developers catch up soon (especially Microsoft!!!).

Next month I'll be looking at object positioning, 3D layering and an alternative way of hiding and revealing text. Until then, happy authoring!


(C) Paul Stephens 1997

Back to the menu