NamePros
Welcome, Guest! Ready to make a name for yourself in the domain business? We welcome both the hobbyist and professional domainer to join the discussion as part of the NamePros community.

Click here to create your profile to start earning reputation for posting, and trader ratings for buying & selling in our free e-marketplace. Build your trader rating with each successful sale. Our system has tracked over 100,000 sales and counting!
FAQ & TOS Register Search Today's Posts Mark Forums Read

Go Back   NamePros.com > Website Development Discussion Forums > Programming > CODE
Reload this Page Matrix Text Effect

CODE This forum is for posting code snippets and example scripts that aren't quite tutorials, but could be useful for others. You may post code snippets and/or completed scripts that you've written and want to share here.

Advanced Search
7 members in live chat ~  


Closed Thread
 
LinkBack Thread Tools
Old 07-04-2006, 05:19 AM THREAD STARTER               #1 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



Matrix Text Effect


Insert the below into the <HEAD> section of your page:
Quote:
<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=11; // must be an odd number
var speed=50; // 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.

/***********************************************
* The Matrix Text Effect- by Richard Womersley (http://www.mf2fm.co.uk/rv)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

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();
????: NamePros.com http://www.namepros.com/code/213350-matrix-text-effect.html
window.onload=function() {
if (!w3c && !ie45) return
var matrix=(w3c)?document.getElementById("matrix"):doc ument.all["matrix"];
ma_txt=(w3c)?matrix.firstChild.nodeValue:matrix.in nerHTML;
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.ran dom()*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.len gth));
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);
}
????: NamePros.com http://www.namepros.com/showthread.php?t=213350
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>
Quote:
<div id="matrix">MATRIX EFFECT</div>
Reputation is always appreciated.
Last edited by blackwizard; 07-04-2006 at 11:37 PM.
blackwizard is offline  
Old 07-04-2006, 04:49 PM THREAD STARTER               #2 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



a friendly *bump*
blackwizard is offline  
Old 07-04-2006, 11:51 PM   #3 (permalink)
NamePros Regular
 
SoapTaco's Avatar
Join Date: Oct 2005
Posts: 349
SoapTaco will become famous soon enoughSoapTaco will become famous soon enough
 



This is pretty cute.
__________________
PM me if you need a custom template for any scripts including Pligg, WordPress, PHPizabi, and more.
SoapTaco is offline  
Old 07-04-2006, 11:55 PM   #4 (permalink)
NamePros Regular
Join Date: Dec 2005
Posts: 210
wackyjoe is on a distinguished road
 



umm it dosent work for me for some reason?

here i managed to get it to work if any1 had a problem

PHP Code:
<script type="text/javascript" language="JavaScript">

<!--
var 
rows=11// must be an odd number
var speed=50// 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.

/***********************************************
* The Matrix Text Effect- by Richard Womersley (http://www.mf2fm.co.uk/rv)
* This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/

var w3c=document.getElementById && !window.opera;;
var 
ie45=document.all && !window.opera;
var 
ma_tabmatempma_bodma_rowxycolumnsma_txtma_cho;
var 
m_coch=new Array();
????: NamePros.com http://www.namepros.com/showthread.php?t=213350
var 
m_copo=new Array();
window.onload=function() {
    if (!
w3c && !ie45) return
  var 
matrix=(w3c)?document.getElementById("matrix"):document.all["matrix"];
????: NamePros.com http://www.namepros.com/showthread.php?t=213350
  
ma_txt=(w3c)?matrix.firstChild.nodeValue:matrix.innerHTML;
  
ma_txt=" "+ma_txt+" ";
  
columns=ma_txt.length;
  if (
w3c) {
    while (
matrix.childNodes.lengthmatrix.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=0x<rowsx++) {
      
ma_row=document.createElement("tr");
      for (
y=0y<columnsy++) {
        
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=0x<rowsx++) {
      
ma_tab+='<t'+'r>';
      for (var 
y=0y<columnsy++) {
        
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=0x<columnsx++) {
    
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=0y<columnsy++) {
    
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>&& 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)+1m_copo[y]++;
      else if (
ma_row==Math.floor(rows/2)+&& m_coch[y]==ma_txt.charAt(y)) zoomer(y);
      else if (
ma_row<rows+2m_copo[y]++;
      else if (
m_copo[y]<100m_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==columnsclearInterval(ma_bod);
}

function 
zoomer(ycol) {
  var 
mtmpmtemytmp;
  if (
m_copo[ycol]==Math.floor(rows/2)+1) {
    for (
ytmp=0ytmp<rowsytmp++) {
      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(0mtmp)+ma_cho.substring(mtmp+1ma_cho.length);
    }
    if (
Math.random()<reveal-1ma_cho=ma_cho.substring(0ma_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]==200m_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> 
Last edited by wackyjoe; 07-05-2006 at 12:07 AM.
wackyjoe is offline  
Old 07-05-2006, 12:07 AM THREAD STARTER               #5 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



http://www.sachinthelegend.info/matrix.html

here is the Sample.!
blackwizard is offline  
Old 07-05-2006, 12:10 AM   #6 (permalink)
NamePros Regular
Join Date: Dec 2005
Posts: 210
wackyjoe is on a distinguished road
 



i got the code from dynamic drive directly, that seemed to work for me.
wackyjoe is offline  
Old 07-05-2006, 01:28 AM THREAD STARTER               #7 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



Thanks for the help, man. But the code works good for me. and for oothers I hope.
blackwizard is offline  
Old 07-05-2006, 05:16 AM   #8 (permalink)
NamePros Regular
 
jontalbot's Avatar
Join Date: Jul 2005
Location: New Hampshire
Posts: 575
jontalbot is a jewel in the roughjontalbot is a jewel in the roughjontalbot is a jewel in the rough
 



it looks cool.. but it takes a long time for the words to show up..
__________________
MRHOST.CO
jontalbot is offline  
Old 07-05-2006, 05:49 AM THREAD STARTER               #9 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



Thats how a matrix is. Thanks for the feedback.
blackwizard is offline  
Old 07-20-2006, 03:07 PM   #10 (permalink)
NP Maniacâ„¢
 
Phoenix's Avatar
Join Date: Apr 2004
Location: Nottingham, UK
Posts: 820
Phoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to beholdPhoenix is a splendid one to behold
 




No offense, but it's just ever so slightly tacky to have that on a website .
__________________
PHP/MySQL Development offered: PM me for a quote.
47ideas.com - my freelancing portfolio.
Phoenix is offline  
Old 07-28-2006, 04:41 AM THREAD STARTER               #11 (permalink)
Account Closed
Join Date: Oct 2005
Location: India
Posts: 633
blackwizard is a jewel in the roughblackwizard is a jewel in the roughblackwizard is a jewel in the rough
 



Thanks for the Feedback, Pheonix.
blackwizard is offline  
Closed Thread


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools


 
All times are GMT -7. The time now is 02:47 PM.

Domain name forum recommended by Domaining.com Powered by: vBulletin® Copyright ©2000 - 2012, Jelsoft Enterprises Ltd.
Search Engine Friendly URLs by vBSEO 3.6.0 Ad Management plugin by RedTyger