New Revised CSS Library Forums Web Tools
FAQs Awards Usage Terms Contact
Categories
Other Sections
Sweet Ads
Compatibility
Bookmark online:


IE5+

News Updater Script

Author: Dynamic Drive

Description: A "news updater" that rotates among different messages. Infinite number of messages can be added to the updater. This script uses a special mechanism to dynamically determine the height of the longest message, and sets itself to match this height. Browsers other than IE 4.x will simply see nothing.

Demo:



Directions Developer's View

Step 1: Copy the below into the <head> section of your web page:

Select All

Step 2: Copy the below into the <body> section of your web page (preferably inside a table column that has its width specified, ie 230, or 25%):

Select All

Step 3: Finally, add the below into the <body> tag itself, like this:

<body onLoad="begin()">

Configuring the updater

Changing the text appearance: You can configure the text appearance of the updater in two ways. To change the font color, go to the code in Step 1. Find the line:

#whatsnew a{color:730073;text-decoration:none}

near the buttom of the code, and change 730073 to another color .

To change the font type, find the line:

#whatsnew, #temp {font-weight:bold; font-family:Arial}

and change "Arial" to another font type.

Adding additional messages: By default, the Updater accomodates 5 messages. This is by no means a hard-coded number. Inside the code of Step 2, you see:

"
tickers[0]='<a href="0.htm.htm">This is message 0</a>'
tickers[1]='<a href="1">This is message 1</a>'
"

To add additional messages, simply add more of

tickers[0]='<a href="0.htm">This is message 0</a>'

with "0" changed to reflect the number of the current message. Subsequently, you can delete messages simply by removing it from the list.

Note 1: As mentioned in Step 2, you should insert the News Updater in a table column that has a controlled width (like in the demo). This is due to the fact that the Updater automatically expands to span the entire width of whatever is containing it. Inserting it in open space (as opposed to a table column) means the Updater will span the entire width of the document, which, for the most part, is not what we want.

Note 2: The News Updater was designed for IE 4.x...all other browsers will simply see no text at all, as if the Updater didn't exist. You can add in alternate HTML text to be shown for these browsers by inserting it in the location documented in the code in Step 2.