CodeS-SourceS est hébergé par Frontier.fr

Ce site au démarrage

begin process at 2012 05 28 11:17:45

Accueil Codes Tutoriels Forum Livres Emploi Services Connexion

Trouver un code source :

dans

[ Dernières recherches ]

Accueil >

MATRIX EFFECT

Information sur la source

Note :

7,75 / 10

Catégorie :Effets Classé sous :matrix, effet, texte, défilement, matrice Niveau :Initié Date de création :12/11/2002 Date de mise à jour :12/11/2002 17:10:34 Vu / téléchargé :21 090 / 578

Auteur : nitro120

Ecrire un message privé

Commentaire sur cette source (6)

Ajouter un commentaire et/ou une note

Description

ben ca fé un effet joli mais c lent
(ca marche mieux avec IE pask les lettres sont renversées avec ie alors...)

Source

<html>
<head>
<title>Matrix-like</title>
<script language="JavaScript">
/*
filter:fliph;
*/
</script>
<style>
body{
font-size:20pt;
font-weight:none;
background-color:#000000;
color:#000000;
}
</style>
</head>
<body scroll=no>
<script language="JavaScript">
// definition de quelques valeurs
var cw=document.body.clientWidth
var ch=document.body.clientHeight
var nb_cols=Math.floor(cw/16)
// nb_cols--
var nb_rows=Math.floor(ch/30)
nb_rows--
var dk_colors=new Array("#173317","#215221")
var normal_color="#40A241"
var light_color="#A9F0AC"
var rnd_gly=new Array("a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z",",","/","+","-","*","_","{","%","!",".",";","$","1","2","3","4","5","6","7","8","9","0")
// boucle collones et char+couleurs
for(n_col=0;n_col<=nb_cols-1;n_col++){
document.write("<div id=d"+n_col+" style='position:absolute;top:0px;'><tt></div>")
document.getElementById("d"+n_col).style.width=16
document.getElementById("d"+n_col).style.left=(n_col*16)
var nb_chars=Math.floor(Math.random()*(nb_rows))
document.getElementById("d"+n_col).style.height=(nb_chars+1)*30
var h_div=parseInt(document.getElementById("d"+n_col).style.height)
// pour vérifier ajouter à la ligne en dessous //
document.getElementById("d"+n_col).style.top=-h_div
document.getElementById("d"+n_col).style.filter="fliph"
// mettre des caracteres avec des couleurs
for(n_char=0;n_char<=nb_chars;n_char++){
if(n_char<=1){
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+dk_colors[n_char]+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else if((n_char>1)&&(n_char<nb_chars)){
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+normal_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else{
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+light_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt>"
}
}
// fin de déf des char_colorés ^
}
// fin boucle collones ^
var deja_fait_st=new Array()
var deja_fait_st_index=0
function del_et_restart(numero){
// del HTML
document.getElementById("d"+numero).innerHTML="<tt>"
// resiZe
var nb_chars=Math.floor(Math.random()*(nb_rows))
document.getElementById("d"+n_col).style.height=(nb_chars+1)*30
var h_div=parseInt(document.getElementById("d"+n_col).style.height)
document.getElementById("d"+n_col).style.top=-h_div
// re-cholor et text
for(n_char=0;n_char<=nb_chars;n_char++){
if(n_char<=1){
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+dk_colors[n_char]+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else if((n_char>1)&&(n_char<nb_chars)){
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+normal_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else{
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+light_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt>"
}
}
}
bas()
function bas(){
for(n_col=0;n_col<=nb_cols-1;n_col++){
if(parseInt(document.getElementById("d"+n_col).style.top)<=ch){
document.getElementById("d"+n_col).style.top=parseInt(document.getElementById("d"+n_col).style.top)+30
}else{
del_et_restart(n_col)
}
}
window.setTimeout("bas()",50)
}
/* bas_st()
function bas_st(){
var current_down=Math.random()*nb_cols
// recherche
for(i=0;i<=deja_fait_st.length;i++){
if (deja_fait_st.slice(i,i+1).substring(current_down)==-1){
deja_fait_st[deja_fait_st_index]=current_down
deja_fait_st_index++
}
else break
}
if(deja_fait_st==nb_cols){
void(0)
}else{
document.getElementById("d"+n_col).style.top+=30
bas_st()
}
}
window.alert(nb_cols)
window.alert(nb_rows)
window.alert(nb_cols*nb_rows)
document.write("<nobr>")
for(n_col=0;n_col<=nb_cols-1;n_col++){
document.write("<div id=d"+n_col+" style='position:absolute;top:0px;'><tt>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</div>")
document.getElementById("d"+n_col).style.width=16
document.getElementById("d"+n_col).style.left=(n_col*16)
document.getElementById("d"+n_col).style.top=0
document.getElementById("d"+n_col).style.height=ch-10
// document.getElementById("d"+n_col).style.filter="fliph"
// boucle contenu
for(i=0;i<nb_rows;i++){
document.getElementById("d"+n_col).innerHTML+=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"<br>"
}
document.getElementById("d"+n_col).innerHTML+=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]
}
document.write("</nobr>")
window.setTimeout("down()", 5)
function down(){
for(n_col=0;n_col<=nb_cols-1;n_col++){
document.getElementById("d"+n_col).innerHTML=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"<br>"+document.getElementById("d"+n_col).innerHTML
// document.getElementById("d"+n_col).innerHTML=document.getElementById("d"+n_col).innerHTML.substring(0, document.getElementById("d"+n_col).innerHTML.lastIndexOf("<br>"))
}
window.setTimeout("down()", 500)
}
*/
</script>
</body>
</html>

<html>
<head>
<title>Matrix-like</title>
<script language="JavaScript">
/*
filter:fliph;

*/
</script>
<style>
body{
font-size:20pt;
font-weight:none;
background-color:#000000;
color:#000000;
}
</style>
</head>
<body scroll=no>
<script language="JavaScript">
// definition de quelques valeurs
var cw=document.body.clientWidth
var ch=document.body.clientHeight
var nb_cols=Math.floor(cw/16)
// nb_cols--
var nb_rows=Math.floor(ch/30)
nb_rows--
var dk_colors=new Array("#173317","#215221")
var normal_color="#40A241"
var light_color="#A9F0AC"
var rnd_gly=new Array("a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z",",","/","+","-","*","_","{","%","!",".",";","$","1","2","3","4","5","6","7","8","9","0")

// boucle collones et char+couleurs
for(n_col=0;n_col<=nb_cols-1;n_col++){
document.write("<div id=d"+n_col+" style='position:absolute;top:0px;'><tt></div>")
document.getElementById("d"+n_col).style.width=16
document.getElementById("d"+n_col).style.left=(n_col*16)
var nb_chars=Math.floor(Math.random()*(nb_rows))
document.getElementById("d"+n_col).style.height=(nb_chars+1)*30
var h_div=parseInt(document.getElementById("d"+n_col).style.height)
// pour vérifier ajouter à la ligne en dessous // 
document.getElementById("d"+n_col).style.top=-h_div
document.getElementById("d"+n_col).style.filter="fliph"


// mettre des caracteres avec des couleurs
for(n_char=0;n_char<=nb_chars;n_char++){
if(n_char<=1){
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+dk_colors[n_char]+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else if((n_char>1)&&(n_char<nb_chars)){
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+normal_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else{
document.getElementById("d"+n_col).innerHTML+="<tt><font color='"+light_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt>"
}
}
// fin de déf des char_colorés ^
}
// fin boucle collones ^


var deja_fait_st=new Array()
var deja_fait_st_index=0

function del_et_restart(numero){
// del HTML
document.getElementById("d"+numero).innerHTML="<tt>"
// resiZe
var nb_chars=Math.floor(Math.random()*(nb_rows))
document.getElementById("d"+n_col).style.height=(nb_chars+1)*30
var h_div=parseInt(document.getElementById("d"+n_col).style.height)
document.getElementById("d"+n_col).style.top=-h_div
// re-cholor et text
for(n_char=0;n_char<=nb_chars;n_char++){
if(n_char<=1){
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+dk_colors[n_char]+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else if((n_char>1)&&(n_char<nb_chars)){
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+normal_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt><br>"
}else{
document.getElementById("d"+numero).innerHTML+="<tt><font color='"+light_color+"'>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</font></tt>"
}
}
}





bas()
function bas(){
for(n_col=0;n_col<=nb_cols-1;n_col++){
if(parseInt(document.getElementById("d"+n_col).style.top)<=ch){
document.getElementById("d"+n_col).style.top=parseInt(document.getElementById("d"+n_col).style.top)+30
}else{
del_et_restart(n_col)
}
}
window.setTimeout("bas()",50)
}


/* bas_st()
function bas_st(){
var current_down=Math.random()*nb_cols
// recherche
for(i=0;i<=deja_fait_st.length;i++){
if (deja_fait_st.slice(i,i+1).substring(current_down)==-1){
deja_fait_st[deja_fait_st_index]=current_down
deja_fait_st_index++
}
else break
}
if(deja_fait_st==nb_cols){
void(0)
}else{
document.getElementById("d"+n_col).style.top+=30
bas_st()
}
}


window.alert(nb_cols)
window.alert(nb_rows)
window.alert(nb_cols*nb_rows)
document.write("<nobr>")

for(n_col=0;n_col<=nb_cols-1;n_col++){
document.write("<div id=d"+n_col+" style='position:absolute;top:0px;'><tt>"+rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"</div>")
document.getElementById("d"+n_col).style.width=16
document.getElementById("d"+n_col).style.left=(n_col*16)
document.getElementById("d"+n_col).style.top=0
document.getElementById("d"+n_col).style.height=ch-10
// document.getElementById("d"+n_col).style.filter="fliph"
// boucle contenu
for(i=0;i<nb_rows;i++){
document.getElementById("d"+n_col).innerHTML+=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"<br>"
}
document.getElementById("d"+n_col).innerHTML+=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]
}
document.write("</nobr>")
window.setTimeout("down()", 5)

function down(){
for(n_col=0;n_col<=nb_cols-1;n_col++){
document.getElementById("d"+n_col).innerHTML=rnd_gly[Math.floor(Math.random()*rnd_gly.length)]+"<br>"+document.getElementById("d"+n_col).innerHTML
// document.getElementById("d"+n_col).innerHTML=document.getElementById("d"+n_col).innerHTML.substring(0, document.getElementById("d"+n_col).innerHTML.lastIndexOf("<br>"))
}
window.setTimeout("down()", 500)
}



*/
</script>
</body>
</html>

Conclusion

ca fait longtemps ke je lé fé alors ya surement des trucs inutiles a supprimer
de plus jai pas envie now de regarder si jai laissé des commentaires inutilz

Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

matrix-like.htm 5 135 octets

Télécharger le zip

Sources du même auteur

UNE LIBRARIE JAVASCRIPT UTILITAIRE

TEXTE EN RELIEF (SANS FILTRES CSS NI CONTROLE ACTIVE-X)

TEXTE DÉGRADÉ (DE HAUT EN BAS ET NON PAS LETTRE A LETTRE)

JOLI EFFET ORDINATEUR

S'ASSURER QUE LA FENETRE EST EN PLEIN ECRAN

Toutes les sources de nitro120

Sources de la même categorie

BOUTON ROTATIF par kazma

SHOWMAPAREA par phidelum

DHTML IE FILTRE DÉGRADÉ (OUTIL HTML POUR DÉVELOPPEUR) par internetdev

ANIMATION DU TEXTE par brennal

EFFET RAYONS DU SOLEIL par tefa24600

Toutes les sources de la catégorie Effets

Sources en rapport avec celle ci

FONDU ENCHAINER ENTRE PLUSIEURS IMAGES par ryosama

EFFET D'EXPLOSION SUR TEXTE ET/OU IMAGE par PetoleTeam

EFFET D'ONDULATION SUR TEXTE ET/OU IMAGE par PetoleTeam

EFFET DE DRAPEAU SUR TEXTE ET/OU IMAGE par PetoleTeam

ANIMATION DE TEXTES par PetoleTeam

Commentaires et avis

Commentaire de nitro120 le 12/11/2002 17:20:26

javé pas regardé sur le coup mais en effet ya du code ki sert a rien
jarrangerais ca un otre jour (g une disserte a fere now)

Commentaire de webdeb le 10/08/2003 19:28:01

Sympa mais c'est vrai que c'est lent !

@+ et Bonne Continuation

Commentaire de jeff_the_lifeguard le 24/02/2004 02:21:46

pour mon ordi c pas lent, ce script yé vite, mais c pas pour cela que j'écris!! ;-) Aussitot que l'on écrit quelque chose sur la page, tout fonctionne bien, sauf une petit maudite affaire. Où est-elle passer la scroolbar. Quelqu'un peut m'aider ???

Commentaire de Evil le 04/11/2004 08:32:30

Bon, c'est complêtement raté l'effet avec Opera, avec IE, si le cpu n'est pas beaucoup loadé, le script est rapide, mais si on a, un éditeur php/html un serveur apache + mysqldadmin qui tourne et enfin Winamp de chargé :p avec des dizaines de fichiers textes et 5 dossiers ouverts, trois pages IE et Opera loadé sur 9 sites dont 6 pages chacuns....
Là ça rame LOL :/

Commentaire de stfou le 14/05/2006 12:00:47

BRAVO, mais comment tu fais pour retourner les caractères ?
(?:¿)

Commentaire de HACKANDROID le 21/08/2011 02:00:32 9/10

J'adore Mais c'est possible d'enlever le léger ralentissement qui arrive par moment? (Un stop de quelque millième de S).

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

Effet de texte [ par romain2boss ] Salut,je suis pas un fan de javascript, et je cherche de puis un bon bout de temps un script de défilement de texte qui fasse un peu comme l'intro de effet de fading [ par spookyz ] Bonjour je voudrais savoir si il est possible et comment faire (je suis debutant ) pour avoir un effet de fading sur la couleur de fond d'un menu et s barre de défilement vertical de texte en javascript [ par ordirepair ] bonjour, je cherche un script en java pour créer un block texte avec une hauteur fixe et une barre de défilement à droite si le texte est plus long je Défilement horizontale d'un texte [ par NestleMatt ] Bonjour !Je voudrai savoir si il est possible en JavaScript de faire défiller du texte dans une InputBox via un texte tappé dans l'HTML ou peut étre v calcul de moyenne [ par ludoweb ] Bonjour à tousJ'aurais besoins de votre aide sur un problème... sur le script si dessous (il n'est pas de moi) L'utilsateur entre un nombre et en vali Texte défilant avec arrêt souris [ par Jonef ] Salut à tousJ'ai un petit prob car j'aimerais créer un page internet où il y aurait un script java qui ferait défiler un texte horizontalement et qui pb verif formulaire [ par MarsL ] J'ai un formualire avec le premier champs obligatoire de type texte et qui ne doit pas etre nul.Actuellement je vérifie juste s'il n'est pas nul.Et lo Liste déroulante et zone de texte [ par tampigns ] Bonjour,Je souhaiterais pouvoir controler une liste déroulante par une zone de texte ou pouvoir utiliser la liste seule.J'explique :Je voudrais par ex Dialogue avec Windows Media Player - problème avec les chaines de caractères [ par zemeilleur ] Bonjour à tous (et bonne année) !Un petit problème (probablement crétin) pour commencer l'année :Je crée un lecteur mp3<div style="visibility:hidde

Nos sponsors

Derniers Blogs

IMAGINE CUP 2012, MAKE A SIGN EN FINALE par junarnoalg

KINECT 1.5 IS OUT ! par Vko

LES ACTUALITéS DE LA SEMAINE SUR C2I.FR (14 MAI - 20 MAI) par richardc

REACTIVE EXTENSIONS : CONSOMMER DES SERVICES AVEC RX PARTIE 3, LES PIèGES à éVITER par Groc

SHAREPOINT BLOG SITE, PROBLèME D'ARCHIVES par junarnoalg

Forum

RE : CODE POUR FAIRE APPARAîTRE UN TEXTE EN DESSOUS D'UN LIEN par emuleed2k

RE : RéCUPERATION D'UNE VARIABLE DE JAVASCRIPT VIA PHP par smahaneAAI

POPUP OUVERT à PARTIR D'UN IFRAME par mrassaa

UTILISER UN .JS par zaikoe

RE : CODE BUG JAVASCRIPT par zaikoe

Côté IT

Offres d'emploi

Formations Video

Appels d'offres

Realisation d-une version 2 d-un site e-commerce existant sous prestashop-REPUBLICATION
Budget : 5 000€
Recherche Infogerance Serveur Debian Linux
Budget : 1 800€
Creation d-un site vitrine avec MagentO
Budget : 2 000€

Logiciels

sDEVIS-FACTURES vlPRO (8.1.0.3)
SDEVIS-FACTURES VLPRO (8.1.0.3)

sDEVIS-FACTURES vlPRO a été mis au point pour les particuliers, créateurs, entrepreneurs, artisa...

Cliquez pour télécharger sDEVIS-FACTURES vlPRO
974 Application Server (12.2.4.6)
974 APPLICATION SERVER (12.2.4.6)

Développez de puissantes applications dans un environnement de 'cloud computing', clusterisé, séc...

Cliquez pour télécharger 974 Application Server
vPicture (1.4.2.1)
VPICTURE (1.4.2.1)

Avec vPicture, hébergez vos images facilement et rapidement. vPicture est un utilitaire simple, ...

Cliquez pour télécharger vPicture
Easy-Planning (2.2.1.6)
EASY-PLANNING (2.2.1.6)

Easy-Planning permet de créer des plannings sous la représentation de diagrammes et est adapté au...

Cliquez pour télécharger Easy-Planning
COM-BACKUP (2.0)
COM-BACKUP (2.0)

COM-BACKUP est un logiciel de sauvegarde qui permet de planifier les sauvegardes de vos dossiers ...

Cliquez pour télécharger COM-BACKUP