| home / experts / dhtml / column27 |
|
Version 3 of the Fader script began as a short addendum (to be labelled Version 2.02) after the request of my editor, Andy King, who wanted the Fader to optionally become a "Flipper." No, not a dolphin, but a headline display without effects, using just a simple replacement of the on-screen text. He also wanted the ability to choose the number of headlines per display.
We quickly created a custom hard-coded Flipper, and Andy included it on the WebReference home page. I then moved on to incorporate flipping capability in the original fader code. Extensive browser version and platform tests, however, led to more modifications than originally planned. We ended up with a stabler, more versatile and compatible script that qualified as a new major version.
As usual, it's easier to build a script than to discuss it. The best way to approach Fader Version 3.0 is to document the modifications by subject, not linearly, exactly as it was created. This means that some functions may be discussed more than once if multiple changes were made to them for different reasons. This approach also guarantees that you'll read through the complete article! The complete script, for your reference, is repeated in our final code pages.
Many of the Version 3 modifications were made to accommodate particular browser quirks. In the beginning of the external fader.js script, we declare variables that identify these browsers:
NS4 = (document.layers);
IE4 = (document.all);
appVer = navigator.appVersion;
IEmac = (IE4 && appVer.indexOf("Mac") != -1);
IE4mac = (IEmac && appVer.indexOf("MSIE 4") != -1);
IE40mac = (IE4mac && appVer.indexOf("4.0;") != -1);
IE45mac = (IE4mac && appVer.indexOf("4.5;") != -1);
NSpre401 = (NS4 && parseFloat(appVer) <= 4.01));
NSpre403 = (NS4 && parseFloat(appVer) <= 4.03));
Notice that we have moved the NS4/IE4 variable declarations to the external script. Since all DHTML browsers are compatible with the Fader, and the external script is loaded only by version 4 browsers, we do not need these variables in-page. They can now reside in our external script, only.
True to form, the two browsers store their version numbers in the navigator object appVersion property in different ways. Navigator established the appVersion property and placed the complete version number first, allowing one to use parseFloat() to grab the complete number or parseInt() to get only the major number in an elegant fashion. For example, Navigator 4.01, for Windows, stores this string in appVersion:
4.01 [en] (Win95; I)
Explorer places the major version number first, and identifies the complete version number later. For example, Explorer 4.01 has this appVersion string:
4.0 (compatible; MSIE 4.01; Windows 98)
We must, therefore parse the string, in some way. I have chosen to use indexOf() in our script.
Note:
There is a case when even the major version is misleading in Explorer's appVersion string. For example, if you use Explorer 5.0 in compatiblity mode, the major version is identified as 4.0!
4.0 (compatible; MSIE 5.0; Windows 98; DigExt)
Never rely on the initial version in appVersion when identifying IE browsers. Always parse the string, checking for the version you want to identify.
For the Fader script, we need to identify Explorer for the Macintosh, in general, and Versions 4.0 and 4.5 of that browser in particular. We also identify Navigator 4.01a or older, and Navigator 4.03 or older.
These variables will be used for making script adjustments that address minor browser quirks.
With our browser variables declared, let's first look at some IE4 for Macintosh CSS rendering problems.
Produced by Peter Belesis and
Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia
Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers
All Rights Reserved. Legal Notices.
Created: Nov 30, 1999
Revised: Nov 30, 1999
URL: http://www.webreference.com/dhtml/column27/fade3start.html
