The best of both worlds - dual-format pages that contain Dynamic HTML but still work with other browsers.

This page works in any JavaScript-enabled browser. If you're using Internet Explorer 4.0 or later, you'll see a digital clock ticking away above this text. If you're using any other browser, you'll see a static image and some text instead. The page decides for itself whether to execute the IE4-specific JavaScript code which displays and updates the clock, so you don't need to protect it behind a switching page (see previous example).

Programming browser-specific code is quite simple. First I execute my version-checking routine (see source code) when the page is opened. This places a true or false value in the variable 'RunningIE4'. I can then protect all IE-specific code like this:

if (RunningIE4 == true) {

  IE4-specific code

} else {

  alternative code for non-IE4 browsers

}

Programming all your pages to be dual-format like this is a complex business, and probably not worth the effort - and anyway, pages authored from the ground up to make use of Dynamic HTML aren't likely to make much sense without the DHTML features. If you want to offer a lot of dual-format content on your site, then you're probably better off authoring two complete sets of pages and protecting the IE4-specific ones with a switching routine (also shown inthis month's examples). However, this technique is a handy way to add the odd IE-specific tweak to your existing pages while still remaining compatible with other browsers.

Incidentally, my clock routine (a modified version of an example from Microsoft's Internet Client SDK) uses the window.setInterval method to set an timer which updates the display at specified intervals (once a second in this case). There's more on Interval timers in this month's Animation examples.


Back to menu