Paul's Web Design Pages issue 136 (February 98)

Dynamic HTML Part 3

More on DHTML for Internet Explorer 4.0 - this month, dealing with non-IE4 browsers, writing dual-format pages, animated object moves and a far better banner.

This month in my Publish and Be... Web authoring series, I've delved deeper into Microsoft's version of Dynamic HTML, which lets you treat all the elements on a Web page (images, text etc) as programmable objects.

Sadly, Microsoft and NetScape have disagreed on what 'Dynamic HTML' should actually be, so most DHTML written for Internet Explorer 4.0 won't work in Navigator 4.0, and vice-versa. That makes 'defensive coding' - graceful handling of the situation where your pages are accessed by a browser that can't handle your code - a vital, and long-term, issue. This month I look at how to check that a user is running IE4 (or not), and at two ways of dealing with non-IE4 browsers - avoiding them altogether, and writing pages that degrade gracefully when accessed by them.

Last month I took a detailed look at object positioning, one of the major 'goodies' in IE4 Dynamic HTML. This month I've used positioning, along with JavaScript's long-established interval timers, to create animated object moves. Animation is already proving one of the most popular DHTML tricks, and it's really easy to do - so have a go! Finally, if you remember Chris Skepper's random ad banners from issue 130, you may recall that at the time JavaScript couldn't match server-side programmed banners, which automatically cycle through images and associated hyperlinks. Now, with DHTML, it can, so I've built a new version.

Below are are links to this month's example Web pages. You don't have to be using IE4 to view them, although you won't see the DHTML features in action if you're not (you will, however, be able to view their source code). When developing IE4 pages, it's a good idea to keep another browser installed on your PC (I use Navigator 4) so that you can check what non-IE4 users will see, and that your redirection pages (see below) are working properly. If you've got IE4 plus an alternative browser, try accessing these pages using the alternative as well, and see what happens.

Checking for IE4 - switching to alternative pages for IE4 and non-IE4 browsers.

Dual-purpose pages which run on both IE4 and other browsers.

Animation - using object positioning and interval timers to 'move' objects across the screen.

A better banner - using interval timers and object properties to produce true hyperlinked slide-shows.

Back to Paul's PC Pages