Today is . Page created 12/20/03, updated 08/05/06
 Matrix Text Effect Message 
|
The Matrix Text Effect Message!
Today is . Page created 12/20/03, updated 08/05/06
|
Matrix Text Effect Message
|
Requiring little introduction, this creative DHTML script renders The Matrix effect on any short piece of text!
We have tested the code in IE5.5, IE6.0, Netscape4.08, Firefox1.5.0.1, Opera7.23, Opera8.52, Netscape7.02, Netscape8.0.4 and AOL Explorer1.2. This script worked well in all platforms tested with one (1) variation observed in Netscape4.08, Opera7.23 and Opera8.52.
- The "Matrix" effect is not visible. All you will see is the text that is programmed to act as the message. In other words, you will see the below;
- Your message that you set in the
<div id="matrix">Your Message Goes Here!</div>- Script degrades well and you will not get any error messages
Depending on your knowledge of HTML and java scripts, this is an easy, two (2) part copy and paste code with minimal reconfigurations. The first part goes in the <HEAD> section of your document and the <div> tag goes anywhere in the <BODY> section you want this effect to appear.
<!---- Reconfigurations <HEAD> Section ---->
<style type="text/css">
.matrix { font-family:Lucida Console, Courier,
Monotype; font-size:10pt;
text-align:center; width:10px;
padding:0px; margin:0px;}
</style>
Define The Above Parts Of Code
font-family:Lucida Console, Courier, Monotype; This refers to the font styles used for the effect. You can change these to any font* you prefer.
Size ~ Speed And Positioning Settings
<!--
var rows= 5; // must be an odd number
var speed= 10; // lower is faster
var reveal= 2; // between 0 and 2 only. The higher, the faster the word appears
var effectalign=" default" //enter "center" to center it.
/***********************************************
Define The Above Parts Of Code
var rows= 5; // must be an odd number This refers to how long (vertical) the effect is. It works the same way as the settings in a textarea form box for rows.
T he below part of the script ( still in the <HEAD> section ) reconfigures the background color.
ma_tab=document.createElement("table");The above color is set to "Black". #000000 is the HEX code for black. We have included a HEX code chart for your convenience.
[
Color Chart With Hex & RGB Codes ~ IE & Netscape ]
You may also want to look into a small (485k) "Freeware" offline Visual Color Picker. It is a simple color selection program with instant RGB-HSV conversion. It contains predefined and custom color tables, HTML code converter as well as a text/background color preview. The program also allows you to save selected colors to a custom color collection. If you would like to see this program, grab the below link and you are there.
[ Visual Color Picker ]
The below part of the script ( still in the <HEAD> section ) reconfigures the character colors. There are four ( 4 ) places within the code that will look like the below where you can change the character colors. Play around with this and you can come up with some wild color schemes.
