Results 1 to 5 of 5

Thread: Script for the "The Matrix" Text effect

  1. #1
    Join Date
    Aug 2006
    Posts
    201

    Script for the "The Matrix" Text effect

    Hi everyone,
    I want to create a script that can that can do the matrix effect to the fonts. I want to do this because I am creating project for the gaming purpose. And the matrix effect to the fonts are required for that. I have tried a lot but did not succeed. So does anyone know the Script for the "The Matrix" Text effect Please provide me with the appropriate script.!!
    Don't be afraid of darkness, it's in your heart anyway.

  2. #2
    Join Date
    Nov 2008
    Posts
    1,192

    Re: Script for the "The Matrix" Text effect

    I think that the Matrix effect is that the digital letters gradually drop down to form the phrase of your choice. There are creative DHTML script renders The Matrix effect. Such effects are very useful in the gaming and animations websites. The Matrix, a recent and highly popular film about virtual reality, features a striking visual representation of the raw code that comprises the Matrix. The Matrix Code Effect project uses only stock Production Bundle 4.0 functions.

  3. #3
    Join Date
    Mar 2008
    Posts
    349

    Re: Script for the "The Matrix" Text effect

    The code is very much large for the Script for the "The Matrix" Text effect You can download that from the web. But the main disadvantage is that you will have to make a lot of changes according to your need. Since the coding is much vast the time will be consumed a lot. But you will get an idea of the script. I would like to suggest you that you should download such codes from the web.

  4. #4
    Join Date
    Mar 2008
    Posts
    672

    Re: Script for the "The Matrix" Text effect

    You can copy the mentioned code into the HEAD section of your page.
    Code:
    <style type="text/css">
    .matrix { font-family:Lucida Console, Courier, Monotype; font-size:10pt; text-align:center; width:10px; padding:0px; margin:0px;}
    </style>
    
    <script type="text/javascript" language="JavaScript">
    
    <!--
    var rows=15; 
    var speed=50; 
    var reveal=1; 
    var effectalign="default"
    
    var w3c=document.getElementById && !window.opera;;
    var ie45=document.all && !window.opera;
    var ma_tab, matemp, ma_bod, ma_row, x, y, columns, ma_txt, ma_cho;
    var m_coch=new Array();
    var m_copo=new Array();
    window.onload=function() {
    	if (!w3c && !ie45) return
      var matrix=(w3c)?document.getElementById("matrix"):document.all["matrix"];
      ma_txt=(w3c)?matrix.firstChild.nodeValue:matrix.innerHTML;
      ma_txt=" "+ma_txt+" ";
      columns=ma_txt.length;
      if (w3c) {
        while (matrix.childNodes.length) matrix.removeChild(matrix.childNodes[0]);
        ma_tab=document.createElement("table");
        ma_tab.setAttribute("border", 0);
        ma_tab.setAttribute("align", effectalign);
        ma_tab.style.backgroundColor="#000000";
        ma_bod=document.createElement("tbody");
        for (x=0; x<rows; x++) {
          ma_row=document.createElement("tr");
          for (y=0; y<columns; y++) {
            matemp=document.createElement("td");
            matemp.setAttribute("id", "Mx"+x+"y"+y);
            matemp.className="matrix";
            matemp.appendChild(document.createTextNode(String.fromCharCode(160)));
            ma_row.appendChild(matemp);
          }
          ma_bod.appendChild(ma_row);
        }
        ma_tab.appendChild(ma_bod);
        matrix.appendChild(ma_tab);
      } else {
        ma_tab='<ta'+'ble align="'+effectalign+'" border="0" style="background-color:#000000">';
        for (var x=0; x<rows; x++) {
          ma_tab+='<t'+'r>';
          for (var y=0; y<columns; y++) {
            ma_tab+='<t'+'d class="matrix" id="Mx'+x+'y'+y+'">&nbsp;</'+'td>';
          }
          ma_tab+='</'+'tr>';
        }
        ma_tab+='</'+'table>';
        matrix.innerHTML=ma_tab;
      }
      ma_cho=ma_txt;
      for (x=0; x<columns; x++) {
        ma_cho+=String.fromCharCode(32+Math.floor(Math.random()*94));
        m_copo[x]=0;
      }
      ma_bod=setInterval("mytricks()", speed);
    }
    
    function mytricks() {
      x=0;
      for (y=0; y<columns; y++) {
        x=x+(m_copo[y]==100);
        ma_row=m_copo[y]%100;
        if (ma_row && m_copo[y]<100) {
          if (ma_row<rows+1) {
            if (w3c) {
              matemp=document.getElementById("Mx"+(ma_row-1)+"y"+y);
              matemp.firstChild.nodeValue=m_coch[y];
            }
            else {
              matemp=document.all["Mx"+(ma_row-1)+"y"+y];
              matemp.innerHTML=m_coch[y];
            }
            matemp.style.color="#33ff66";
            matemp.style.fontWeight="bold";
          }
          if (ma_row>1 && ma_row<rows+2) {
            matemp=(w3c)?document.getElementById("Mx"+(ma_row-2)+"y"+y):document.all["Mx"+(ma_row-2)+"y"+y];
            matemp.style.fontWeight="normal";
            matemp.style.color="#00ff00";
          }
          if (ma_row>2) {
              matemp=(w3c)?document.getElementById("Mx"+(ma_row-3)+"y"+y):document.all["Mx"+(ma_row-3)+"y"+y];
            matemp.style.color="#009900";
          }
          if (ma_row<Math.floor(rows/2)+1) m_copo[y]++;
          else if (ma_row==Math.floor(rows/2)+1 && m_coch[y]==ma_txt.charAt(y)) zoomer(y);
          else if (ma_row<rows+2) m_copo[y]++;
          else if (m_copo[y]<100) m_copo[y]=0;
        }
        else if (Math.random()>0.9 && m_copo[y]<100) {
          m_coch[y]=ma_cho.charAt(Math.floor(Math.random()*ma_cho.length));
          m_copo[y]++;
        }
      }
      if (x==columns) clearInterval(ma_bod);
    }
    
    function zoomer(ycol) {
      var mtmp, mtem, ytmp;
      if (m_copo[ycol]==Math.floor(rows/2)+1) {
        for (ytmp=0; ytmp<rows; ytmp++) {
          if (w3c) {
            mtmp=document.getElementById("Mx"+ytmp+"y"+ycol);
            mtmp.firstChild.nodeValue=m_coch[ycol];
          }
          else {
            mtmp=document.all["Mx"+ytmp+"y"+ycol];
            mtmp.innerHTML=m_coch[ycol];
          }
          mtmp.style.color="#33ff66";
          mtmp.style.fontWeight="bold";
        }
        if (Math.random()<reveal) {
          mtmp=ma_cho.indexOf(ma_txt.charAt(ycol));
          ma_cho=ma_cho.substring(0, mtmp)+ma_cho.substring(mtmp+1, ma_cho.length);
        }
        if (Math.random()<reveal-1) ma_cho=ma_cho.substring(0, ma_cho.length-1);
        m_copo[ycol]+=199;
        setTimeout("zoomer("+ycol+")", speed);
      }
      else if (m_copo[ycol]>200) {
        if (w3c) {
          mtmp=document.getElementById("Mx"+(m_copo[ycol]-201)+"y"+ycol);
          mtem=document.getElementById("Mx"+(200+rows-m_copo[ycol]--)+"y"+ycol);
        }
        else {
          mtmp=document.all["Mx"+(m_copo[ycol]-201)+"y"+ycol];
          mtem=document.all["Mx"+(200+rows-m_copo[ycol]--)+"y"+ycol];
        }
        mtmp.style.fontWeight="normal";
        mtem.style.fontWeight="normal";
        setTimeout("zoomer("+ycol+")", speed);
      }
      else if (m_copo[ycol]==200) m_copo[ycol]=100+Math.floor(rows/2);
      if (m_copo[ycol]>100 && m_copo[ycol]<200) {
        if (w3c) {
          mtmp=document.getElementById("Mx"+(m_copo[ycol]-101)+"y"+ycol);
          mtmp.firstChild.nodeValue=String.fromCharCode(160);
          mtem=document.getElementById("Mx"+(100+rows-m_copo[ycol]--)+"y"+ycol);
          mtem.firstChild.nodeValue=String.fromCharCode(160);
        }
        else {
          mtmp=document.all["Mx"+(m_copo[ycol]-101)+"y"+ycol];
          mtmp.innerHTML=String.fromCharCode(160);
          mtem=document.all["Mx"+(100+rows-m_copo[ycol]--)+"y"+ycol];
          mtem.innerHTML=String.fromCharCode(160);
        }
        setTimeout("zoomer("+ycol+")", speed);
      }
    }
    // -->
    </script>

  5. #5
    Join Date
    May 2008
    Posts
    2,393

    Re: Script for the "The Matrix" Text effect

    After putting the script on your head or the body section, the effect will not work. You will have to insert the below DIV tag where you want the effect to appear on your page :
    Code:
    <div id="matrix">Matrix Effect</div>
    Hope that this will help you..!!

Similar Threads

  1. Replies: 3
    Last Post: 16-01-2014, 09:02 AM
  2. Replies: 7
    Last Post: 22-02-2012, 01:29 PM
  3. Replies: 4
    Last Post: 15-03-2010, 09:39 PM
  4. Replies: 1
    Last Post: 25-12-2008, 09:53 AM
  5. Replies: 2
    Last Post: 06-04-2007, 10:08 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •