Scrolling JavaScript Banners: External JavaScript Files - Doc JavaScript

External JavaScript Files

Since the banner's script is fairly long, we'll keep the HTML code as clean as possible by using two external scripts:

bannerconfig.js - defines several important variables, as well as the banner's configurable properties.
banner.js - operates the dynamic banner.

In theory, you would just have to specify these as external scripts in the document:

<SCRIPT LANGUAGE="JavaScript1.2" SRC="bannerconfig.js">
</SCRIPT>
<SCRIPT LANGUAGE="JavaScript1.2" SRC="banner.js">
</SCRIPT>

This would work fine if it weren't for an annoying bug in Navigator 3.0x. When Navigator 3.0x encounters a <SCRIPT> tag with a SRC attribute, it ignores the LANGUAGE value. All other browsers retrieve the external script only if the specified LANGUAGE is supported. The following table lists the browsers that support each version:

`LANGUAGE`	Browsers
`"JavaScript"`	Navigator 2.0x+ Internet Explorer 3.0x+
`"JavaScript1.0"`	Navigator 2.0x+ Internet Explorer 3.0x+
`"JavaScript1.1"`	Navigator 3.0x+ Internet Explorer 4.0x+
`"JavaScript1.2"`	Navigator 4.0x+ Internet Explorer 4.0x+
`"JScript"`	Internet Explorer 3.0x+

We'll use the following script to dynamically insert the desired scripts:

<SCRIPT LANGUAGE="JavaScript1.2">
<!--
with (document) {
  write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='bannerconfig.js'>");
  write("<\/SCRIPT>");
  write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='banner.js'>");
  write("<\/SCRIPT>");
}
//-->
</SCRIPT>

The script itself is an internal one, so it isn't affected by the bug in Navigator 3.0x. The document.write() statements are only executed on Navigator 4.0x+ and Internet Explorer 4.0x+, because the script is defined as "JavaScript1.2". Notice the backslash in "<\/SCRIPT>", which escapes the slash. The Mac version of Internet Explorer 4.0x requires forward slashes be escaped, so you should include this for compatibility.

The Mac version of Internet Explorer 4.0x does not fully support the clip property. However, we cannot use a simple object detection routine to exclude the browser, because the clip property exists (it just doesn't work). Therefore, we'll check if the user is running the Mac version of Internet Explorer 4.0x:

<SCRIPT LANGUAGE="JavaScript1.2">
<!--
if (navigator.appVersion.indexOf("MSIE 4.0; Macintosh;") == -1) {
  with (document) {
    write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='bannerconfig.js'>");
    write("<\/SCRIPT>");
    write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='banner.js'>");
    write("<\/SCRIPT>");
  }
}
//-->
</SCRIPT>

Note that the preceding script should be placed at the end of the document, just before the </BODY> tag, because the external scripts refer to elements on the page that must be present when they are executed. Here's the complete HTML document (banner.html) required for the banner:

<HTML>
<HEAD>
<TITLE>A Scrolling JavaScript Banner</TITLE>
</HEAD>
<BODY>
<P>This is the beginning of the document.</P>
<P><IMG SRC="blank.gif"
        NAME="holdspace" ID="holdspace"
        WIDTH="400" HEIGHT="21"
        STYLE="visibility:hidden; position:relative;"></P>
<P>This is the end of the document.</P>
<SCRIPT LANGUAGE="JavaScript1.2">
<!--
if (navigator.appVersion.indexOf("MSIE 4.0; Macintosh;") == -1) {
  with (document) {
    write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='bannerconfig.js'>");
    write("<\/SCRIPT>");
    write("<SCRIPT LANGUAGE='JavaScript1.2' SRC='banner.js'>");
    write("<\/SCRIPT>");
  }
}
//-->
</SCRIPT>
</BODY>
</HTML>

The colored elements are the most important ones for the banner. They determine the banner's position and dimensions, and also load the required scripts.

Created: February 10, 1998
Revised: February 10, 1998

URL: https://www.webreference.com/js/column13/external.html

Scrolling JavaScript Banners: External JavaScript Files - Doc JavaScript

External JavaScript Files

Find a programming school near you