Browser Compatibility

The overwhelming majority of browsers used today support JavaScript and JavaScript animation. But some don't.
You'll need to test the viewer's browser to tell if they can view your animation before you use it.

What happens if the viewer has an old browser?

JavaScript animation is predicated on the ability to use the Image object. (The JavaScript Image object is not the same as the HTML <IMG> tag.) If some one views your JavaScript animation and they are using a browser that doesn't support the Image object, your code will generate embarrassing error messages.
Browsers that support the JavaScript Image object include:
If you know that the viewer's browser isn't capable of JavaScript animation you can write scripts that will "fail gracefully" and not generate error messages, but first you need a way to tell which browser the viewer is using:
The code listed below looks at the viewer's browser and will set "bAnimate=true" if the viewer is using one of the browsers that support JavaScript animation. This script should be placed inside the HTML document's HEAD section.
Script to identify viewer's browser


<HEAD>
// VERIFY THAT THE BROWSER IS ONE THAT SUPPORTS THE IMAGE() OBJECT
// BY VERIFYING THAT ONE OF THE FOLLOWING IS TRUE:
//      CASE 1  the client is Netscape version 3 or higher,              
//      CASE 2  the client is Netscape version 2.02 on an OS/2 platform, or      
//      CASE 3  the client is Microsoft Internet Explorer version 4 or higher.

        <SCRIPT>
        <!--
        var bAnimate = false;

        // bAnimate will be set to TRUE if any of the following cases are true.

        // CASE 1:
        bAnimate=(((navigator.appName == "Netscape") && 
        (parseInt(navigator.appVersion) >= 3 )) || 

        // CASE 2:
        (navigator.userAgent == "Mozilla/2.02E (OS/2; I)") || 

        // CASE 3:
        ((navigator.appName == "Microsoft Internet Explorer") && 
        (parseInt(navigator.appVersion) >= 4 )));
        
        //-->
        </SCRIPT>

</HEAD>

Once the browser has been identified you can use the "bAnimate" variable to decide whether you should animate the image. Again, if you try to animate an image on an old browser you'll get a nasty error message.

If bAnimate = 'true' then it's safe to do the animation,
if bAnimate = 'false' then it's better to skip the animation.

You don't have to understand this script to use it. Just put this script in your document's HEAD, and the bAnimate variable will be there for you to use.
[Previous Lesson]    [Tutorial Home Page]    [Next Lesson]