Matrix Background Animation

I thought this would be kinda neat to have this as the background of a webpage. Due to its distraction factor, I would suggest having it only in an intro page or something.

By the way, I did not steal any of these images, I created some matrix-like images using a graphics program.

Instructions:

1: OK, there is one little detail about this script that has to be worked around. You have to put all of your page's content in an absolutely-positioned <DIV> element. This is so the glyphs appear behind your content and not over it.

First, you have to define a style sheet in the <HEAD> section of your page. You can copy/paste the code below if you want:
Select all...

2: Then "wrap" all your HTML content except the HTML that loads the script (more on this below). Also, give the DIV element a classname that you defined in the stylesheet in the previous step.
Select all...

3: Now, add the HTML needed to load the script in your page. Copy this at the very end just before the </body> tag and not in the DIV you created in the previous step.
Select all...

4: There are some settings in the js file you can use to adjust the way the script behaves:

glyphs - An array containing all the glyph image file names. The script will randomly pick from this list when creating the strings. You do NOT have to have a seperate picture for each of the glyphs you want. For instance, I only have 10 seperate images in this example, but there are 400 total glyphs.
glyphs_b - Another array containing the "brighter" glyph image file names. These should be the exact image as the glyphs array, just a lighter colored version. So, the first image in this array should be exactly like the one in the glyphs array, just "brighter" and so on.
glyphCount - Total number of glyphs in the script. 400 seems to work ok. More looks better but decreases performance.
scrollSpeed - The speed of scrolling animation of each glyph in milliseconds (1000 milliseconds = 1 second). 40 to 60 is a good value.
glyphD - Each glyph image width/height. Regardless of actual size, the glyphs will be scaled to this dimension.
disableColors - This setting is used to disable/enable the "brightness" feature. The script looks more like the real thing with this set to false, but runs smoother when set to true.

5: Performance notes:

While this script works in NS4.x, NS6, and IE5+, it seems to require more processing power when run in Netscape 6.x browsers. In my system (Athlon 1.33GHz / 256M DDR RAM / WinXP Pro), IE6 and Netscape 4.78 used only 1% of the CPU and about 11MB of RAM, but Netscape 6 needed about 35% of the CPU and 24MB of RAM (with brightness enabled)!. So, be careful when adding too many glyphs, unless you do not care about NS6 users :)

There are a lot of "things" going on in this script so be careful about adding other scripts along with this one to your page. Your browser may start to get sluggish if it is forced to do too much.