Scroller ~ Pausing up-down message scroller tested in IE5.5, IE6.0, Netscape4.08, Netscape7.02 and Opera7.23

A n up-down message scroller that pauses between each message. You can easily configure the width/height, color, and contents of the scroller. Just change the first four variables of the script to do so.

W e have tested the code in IE5.5, IE6.0, Netscape4.08, Opera7.23 and Netscape7.02 . This script worked well in all platforms tested with variations observed in Netscape4.08 and Opera7.23.

1)    In Netscape4.08 our little compute image does not appear. Reason being is that it is a .ico file type and the browser does not recognize .ico files.

1a)    Solution: Do not use .ico file* types and use either "gif" or "jpg" files.

1b)   *    If you do not understand .ico files, grab the below link for a fuller understanding on them. [ .ico Files ]

1c)    This is a normal variation when it comes to Netscape 4.08

2)    In Opera7.23, the browser does not recognize alt tags in images. In other words, when you place your curser over an image you get a little description. With Opera it will not give you the alt tag description on mouse-over.

3)    None of the above variations hamper the operations of this script in any way.

D epending on your knowledge of HTML and java scripts, this is an easy, one step copy and paste code with minimal reconfigurations. Just paste the code anywhere in the <BODY> section of your document where you want this effect to appear then reconfigure the background image (if any), background color, links, targets, etc.... See below for where and howto reconfigure the code.

Reconfigurations *

//configure the below five variables to change the style of the scroller
var scrollerdelay='3000' //delay between msg scrolls. 3000=3 seconds.
var scrollerwidth='150px'
var scrollerheight='105px'
var scrollerbgcolor='lightyellow'
//set below to '' if you don't wish to use a background image**
var scrollerbackground='scrollerback.gif'

* Take particular note that in reconfiguring this script it makes use of the single quote ' mark. Do Not! make the mistake of replacing them with the double quote " or the script will not work!. You will also get "An Undertermined String Constant" Error message and wonder why.

** Remember, if you are not going to use a background image, set the single quotes '' like so. It may look like a double quote but make no mistake, they are 2 single quote marks right next to each other.

I f you notice in the above example in reference to the:

var scrollerbgcolor='lightyellow'

The script makes use of the word 'lightyellow' and not the HEX code preceded by the #. If you feel more comfortable with HEX codes, feel free to use them instead. (See below) They will work just as well. We have included for your convenience a color chart that displays both words and HEX code also.
[ Color Chart With Hex & RGB Codes ~ IE & Netscape ]

Use Of HEX Code Example

var scrollerbgcolor='#??????'

N otice that we used the prefix character (#) preceding the 6 digit code. Also notice how they are positioned between the '(single quotes)'. Do Not! change them to double quote marks.

A s silly as it may sound, change the ?????? to a valid HEX code.

We have had people write in asking us why the color does not work. After we examined their source code, we found they used our example of question marks instead of a valid HEX code.

B elow we will show you the last part of the reconfigurations. This involves the use of URL paths and target links. Also the removal of the URL link and make it into just a message,

//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[1]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[2]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[3]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[4]="<a href='URL Goes Here'>Message Goes Here</a>"

///////Do not edit pass this line///////////////////////

N otice how the use of " and the ' are both incorporated within this section of the script. When you make the reconfigurations be sure to adhere to the format or you will get a scripting error.

Make Link Open In New Browser Window

messages[0]=" <a href=' URL Goes Here' target='_blank'>Message Goes Here </a>"

S ee the above attribute of target='_blank ' and how we wrote it. This tells the link to open in a new window as opposed to in the same window where you get away from the main page. Be sure to use the single quote ' in this section of script.

Remove URL And Link

T o do this you need to delete the following section of the script for which ever scrolling message you want.

<a href=' URL Goes Here'> You need to remove the </a> also in the ones you do not want link(s). In other words it would look like the below with the link removed.

messages[0]=" Message Goes Here"

Add An Image

H ere again you must make use of the single quote ' with your image tag***

*** <img src='Uploaded Image Here' border='0' height='?' width='?' alt='?'>

N ow lets incorporate the above image tag into the script. Remember, you can position the image as a "Stand Alone" or incorpororated with links, etc. For this example, we will incorporate it with a link.

messages[0]= "<a href='URL Goes Here '><img src=' Uploaded Image Here' border= '0' height='?' width='?' alt='?'> </a> "

A s you can notice in the above example, we did not use the attribute of target='-blank'. You can add this attribute into the link if you want to have it open in a new browser window.

O ne final note on adding or deleting more or less than the default number of scrolling messages. To answer your question in a word, Yes, you can. Just follow the format for numbering the messages. See below:

//configure the below variable to change the contents of the scroller
var messages=new Array()
messages[0]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[1]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[2]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[3]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[4]="<a href='URL Goes Here'>Message Goes Here</a>"
messages[5]="<a href='URL Goes Here'>Message Goes Here</a>"

A ll you need to do is add another number for more than the default number of [5]. That includes the first entry numbered as Zero [0]
messages[5]

I f you would like to add this effect into your pages, just grab the above link in the scroller or below link and you are there. If you have any problems with this, feel free to contact us.
[ Get Code Here ]

Pausing Up ~ Down Scroller