What is JavaScript slide fade marquee?

JavaScript slide fade marquee is a JavaScript script that makes specified text scroll from right to left, stopping as soon as it hits the side, and making the text fade from one color to another at the same time.

How does JavaScript slide fade marquee work?

Here is an example of JavaScript slide fade marquee in working:

Download the JavaScript slide fade marquee script here: slideandfade.js

How to implement the JavaScript slide fade marquee?

First add a reference to the JavaScript in the head of the HTML page, for example:

Next, place a div placeholder on the page with id "fader", for example:

Place the following either as inline JavaScript or on the body's ONLOAD, as follow:

<SCRIPT TYPE="text/javascript">
fadeandscroll('Your text', '#676F77', '#DFF5FF', 40, 70, 250, 10);
</SCRIPT>

What does the parameters for the function mean?

The parameters for the function "fadeandscroll" mean the following:

fadeandscroll(txt,color1,color2,numsteps,fademilli,containerwidth,scrollmilli)

txt	The text that should be user for fading.
color1	The text fades from one color to another. The text fades from this color.
color2	The text fades from one color to another. The text fades to this color.
numsteps	This parameter specifies the number of steps in which the color should fade from the first specified color, to the second specified color.
fademilli	The time in milliseconds before the next color step should take place.
containerwidth	The width in pixels of the region in which the text should slide and fade.
scrollmilli	The time in milliseconds before the text is moved again. The speed of the sliding text can be set using this parameter.

Is this the only way of making text slide?

This JavaScript slide fade text script has the same effect as a HTML marquee with SLIDE behavior. Have a look at this article that discusses the HTML marquee.

What browser compatibility issues might exist?

The script was written using getElementById. Thus if the browser doesn't support this function, the script will not work. This script was tested using Internet Explorer 6 and FireFox version 1.0.6.

Link to this article:

Browse some more: Next Article | Next Fact | More JavaScript Articles | More Clever Facts