DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.0 | 4 | WebReference

DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.0 | 4

Logo

Dynamic Headline Fader, Version 2.0
the external array


In Version 1, we created two arrays: arURL and arTXT, that stored the linked-to URLs and the display text for the headlines:

arURL = new Array(
  "isp-news/1998/01/2301-high.html",
  "fina-news/1998/01/2301-excite.html",
	...
)
arTXT = new Array(
  "Virtual Reality E-Shopping Site Launches",
  "High-Speed Hotel Access on the Horizon",
  ...
)

We then combined them, in our script, into a single two-dimensional array called arNews.

This time around, we will opt for a more elegant solution. We will use only one array, called arNews, which will include both the URLs and the display text.

arNews = [
  "Pegasus Mail 3.0 Public Beta Expected By Friday","",
  "Microsoft Outlook 98 Official Release - Free Download!","32msnet.html#outlook",
  "Paint Shop Pro updated to v5.0 Beta 2.7","32image.html#psp",
  "HyperSnap updated to v3.10.02","32image.html#snap",
  "Transoft FTP Control updated to v2.0","32ftp.html#transftp",
  "CWSApps Top 25 Downloads For Week of March 23rd","top25weekly.html",
  "CWSApps Top 25 Downloads For Month of March","top25monthly.html",
  "Complete Listing of What's New for Today","new.html"
];

Those of you familiar with our Hierarchical Menus script will recognize the syntax:

arNews = [
  Display Text0, URL0,
  Display Text1, URL1,
  Display Text2, URL2,
  ...
];

The array makes visual sense, and it is easier to avoid errors of omission.

To further the elegance, we create the array by literal declaration. That is, we enclose the array elements in array-defining brackets ([]) and assign the array to a variable. This method of array declaration is recognized by fourth-generation browsers only. There is no need to first create an array object using new Array().

Like Version 1, however, we still use the prefix variable:

prefix = "http://cws.internet.com/";

The prefix variable stores a Base URL for your links. Use it if all your links point to the same domain. Otherwise, you may omit it or set to an empty string:

prefix = "";

Declaring Static, non-link Items

If we want the displayed text to not be a link, we simply include an empty string as the text's associated URL element. For example:

arNews = [
  "This Text is Static","",
  "This Text is a Link","dhtml/column25/"
]

The Complete External news.js File

The external array file, therefore, contains only two variables: prefix, a string, and arNews, an array. Here is the complete news.js file for the fader on this page:

prefix = "http://cws.internet.com/";
arNews = [
  "Pegasus Mail 3.0 Public Beta Expected By Friday","",
  "Microsoft Outlook 98 Official Release - Free Download!","32msnet.html#outlook",
  "Paint Shop Pro updated to v5.0 Beta 2.7","32image.html#psp",
  "HyperSnap updated to v3.10.02","32image.html#snap",
  "Transoft FTP Control updated to v2.0","32ftp.html#transftp",
  "CWSApps Top 25 Downloads For Week of March 23rd","top25weekly.html",
  "CWSApps Top 25 Downloads For Month of March","top25monthly.html",
  "Complete Listing of What's New for Today","new.html"
]

Next, let's look at fader.js, the external file that controls the fader.


Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: Sep 07, 1999
Revised: Sep 07, 1999

URL: http://www.webreference.com/dhtml/column25/fade2arrays.html