Voici la dernière version que je viens de finir
Selon la demande de CLAUDEL Remi, j'ai mit des commentaires.
Elle possède en plus un texte style TypeWriter, avec des commandes tels que fondu, effacer l'acran.
Downloadez le zip, il est mieux que le code en bas.
Source / Exemple :
<html>
<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Matrix 1.2 encore mieux !!</title>
<style fprolloverstyle>A:hover {color: #FF0000; text-decoration: underline; font-weight: bold}
</style>
<script language="Javascript">
<!--
/*
Matrix code pour Javascript
Par Clément LEGER (clem@progfr.com)
Ce code et libre de droits, je veux juste que vous me demandez mon accord, pour le publier,
le modifier ou autre.
//La variable du texte a afficher.
//Elle posède trois commandes pour le moment : <br> pour aller a la ligne, <cls> pour effacer l'écran, et pour les espaces.
//Sinon, mettez sans code, juste du texte a part les trois commandes en haut.
var Buf=" . : [ M a t r i x 1 . 2 ] : .<br><br>Créé par Clément LEGER (clem@progfr.com)<br>J\'ai commenté ce code (Je n\'ai absolument pas l\'habitude de commenter mes codes) car CLAUDEL Remi me la réclamé, pour qu\'il le refasse en C++ (Je ne fait que débuter en C++), et je lui souhaite bon courage, car le Javascript vient peut être du C++, mais le DHTML est totalement diférent.<br>Ce code est loin d\'être parfait, il reste encore tous les bugs, la lenteur (Bill, tu peux pas faire un Javascript plus rapide, on dirait ton Vb), et maintenant il y a en plus a rajouter plusieurs commandes, tels que images, couleur du texte, mise en forme, animation java ou flash,...<br><br><br><rapidfondu_noir>Ce code est gratos (de toute façon, que faire avec une telle lenteur ?), mais j\'espère vraiment que Bill va accélérer le Javascript, car je connait plein de codes qui rament en Javascript, et ça pourrait devenir un bon langage comme le C++, mais en plus souple/simple.<br><br>Bon en clair, je suis nul en programmation (Même si mes copains me trouvent fort, et ne comprennent rien a l\'informatique (Style un qui veut mettre un virus sur un ordi pour faire une blague, et il se demande pourquoi son antivirus (ScanDisk !) detecte un virus...).<rapidfondu_noir>J\'ai 15 ans, je m\'entraine a fond a Counter-Strike avec les bots, car lundi (Peut être la semaine prochaine), en cours je vais faire une mini LAN-Party avec 8 ordis, et anti cheat (Il y en a un qui n\'a pas CS, mais qui est persudé de nous tuer tous, donc je pense qu\'il a trouvé un cheater sur le net).<br>Et puis en même temps je cherche un pseudo pour cette partie, j\'ai pensé a \"H@cker\", mais je pense que le prof comprendra que c\'est moi qui a ouvert son lecteur cd... Et un peu après, le gars que je soupçonne de tricher a CS, il a changé le fond de bureau a l\'ordi auquel j\'étais par ma photo... (Finalement, il a juste fait avec le voisinage réseau une inversion de fonds), je pense donc prendre \"Wiz@rd\", car ça me résume moi :<br> - Le @ comme internet et informatique<br> - Wizard comme sorcier des ordis<br> - Wizard encore car je fan de Harry Poter.<rapidfondu_noir>Bon, je crois que je vais arrêter de raconter ma vie.<br>Si vous avez une question, mailez-moi (clem@progfr.com).<br>A, au fait encore une chose, je vais essayer dans la prochaine version de rajouter un fondu pour l\'apparition du texte, mais le problème est encore la lenteur, car c\'est très simple à faire (On ajoute des font color a chaque caractère avec une couleur qui va du noir pour les premiers caractères, au vert pour les suivants, ou tout simplement mettre le premier caractère plus brillant que les autres).<br>Bon, @+ ;) (Et oui, c'est enfin finit...). Vous pouvez fermer la fenêtre.<fondu_noir>Vous êtes encore là ? Je sais plus quoi écrire aussi...<br>Ben...<br>Comment trouvez vous l'effet typewriter et fondu ?<rapidfondu_noir>";
//Ps: J'ai rajouté deux commandes, je pense que vous l'aurez compris : <fondu_noir> et <rapidfondu_noir> qui font un fondu du texte vers le noir, une autre mettode plus bellle que cls.
var FonduLev=255; //Le niveau du fondu
var NumMattrix=9; //Le nombre de matrix
var Top=new Array(); //On créé les variables pour la hauteur de chaque matrix
var Left=new Array(); //Même chose avec la gauche
var Vit=new Array(); //Et la vitesse
var TheCARS="WTiF#*åÀl·"; //On met on mémoire les caractères qui ressemblent le plus a Matrix avec la police Symbol
function tableau (n) { //Une fonction qui n'est pas de moi et qui est nécésaire pour celle en dessous. Je ne commente donc pas.
var nb;
this.length = n;
for (var i = 1; i <=n; i++)
if (i<10)
{nb = i+"";
nb = nb.substring(0,1);
this[i] = nb;}
return this;
}
function conversion(couleur) { //Et une autre qui n'est pas de moi (C'est tout, il n'y en plus après), qui convertit un nb décimal et nb hexadécimal
var reste=1;
var indice;
var hexa1;
var hexa2;
var couleurHexa;
tabHex = new tableau(16);
tabHex[10]="A"; tabHex[11]="B"; tabHex[12]="C"; tabHex[13]="D"; tabHex[14]="E"; tabHex[15]="F";
indice = 1;
hexa2 = (couleur%16);
hexa1 = parseInt(couleur/16);
hexa2 = tabHex[hexa2];
if (hexa2 == null)
hexa2 = "0";
hexa1 = tabHex[hexa1];
if (hexa1 == null)
hexa1 = "0";
couleurHexa = hexa1 + hexa2;
return couleurHexa;
}
function ChangeCARS() { //C'est la fonction qui permet de changer chaque caractères de la matrix et par la même occasion de déplacer chaque matrix
for (var j=1;j<NumMattrix+1;j++) { //Une boucle pour faire le tour de chaque matrix
Top[j]=Top[j]+Vit[j]; //On descend le matrix en fonction de sa vitesse
if (Top[j] > document.body.clientHeight) { //Si le matrix a dépassé l'écran
Top[j]=-220; //On met sa hauteur un peu au dessus de l'écran, comme ça il arrivera d'en haut.
Left[j]=Math.round(Math.random()*document.body.clientWidth); //On le met a gauche au hasard en fonction de la largeur de l'écran
Vit[j]=Math.round(Math.random()*15)+10; //On lui met une vitesse au hasard
}
eval('document.all.car'+j+'s.style.top=Top['+j+']'); //On actualise sa hauteur
eval('document.all.car'+j+'s.style.left=Left['+j+']'); //Et sa gauche
for (var i=0;i<10;i++) { //Une boucle pour chaque caractères (Il y en a 10)
eval("document.all.car"+j+i+"s.innerHTML='"+TheCARS.substr(Math.round(Math.random()*TheCARS.length-1),1)+"'"); //On met un caractère au hasard en fonction de ce qui il y a dans la variable TheCARS
}
}
setTimeout("ChangeCARS()", 41); //On met un timer pour rééxécuter cette fonction dans 41 millisecondes (Ca fait environ donc 24 images par secondes)
}
function AddCAR() { //La fonction qui ajoute un caractère, ou éxécute la commande du TypeWriter
var ReDoAddCar=1; //Varible de test pour réxécuter après ou pas la fonction (Pour les fondus)
if (Buf.substr(0,4)=="<br>") { //Si c'est la cmd <br>
document.all.TheText.innerHTML=document.all.TheText.innerHTML+"<br>"; //Ben on rajoute <br> dans la page
Buf=Buf.substr(4) //Et on enlève <br> de la variable Buf (Tampon)
} else {
if (Buf.substr(0,6)==" ") { //Pour le retour a la ligne
document.all.TheText.innerHTML=document.all.TheText.innerHTML+" "; //Même chose que <br>
Buf=Buf.substr(6) //J'esplique pas (Je deteste les commentaires)
} else { //
if (Buf.substr(0,5)=="<cls>") { //Pour effacer l'écran
document.all.TheText.innerHTML="";
Buf=Buf.substr(5)
} else {
if (Buf.substr(0,12)=="<fondu_noir>") { //Pour un long fondu vers le noir
Txt=document.all.TheText.innerHTML;
Buf=Buf.substr(12)
FonduLev=255;
do_Fondu_noir();
ReDoAddCar=0;
} else {
if (Buf.substr(0,17)=="<rapidfondu_noir>") { //Pour un fondu rapide
Txt=document.all.TheText.innerHTML;
Buf=Buf.substr(17)
FonduLev=255;
doRapid_Fondu_noir();
ReDoAddCar=0;
} else {
document.all.TheText.innerHTML=document.all.TheText.innerHTML+Buf.substr(0,1); //Si ce n'est pas une commande, c'est du texte et donc a l'ajoute.
Buf=Buf.substr(1) //Et on enlève de la variable Buf le premier caractère (celui qui a été affiché en haut)
}
}
}
}
}
if (ReDoAddCar==1) {setTimeout("AddCAR()", Math.round(Math.random()*1)+40);} //Reéxécuter la commande AddCARR() dan 40 et quelques millisecondes si il n'y a pas de fondu
}
function do_Fondu_noir() { //Le fondu noir lent
document.all.TheText.innerHTML="<font color=\"00" + conversion(FonduLev) + "00\">" + Txt + "</font>"; //On met le texte de la couleur FunduLev en vert.
FonduLev=FonduLev-1; //On met de plus en plus noir
if (FonduLev>0) {setTimeout("do_Fondu_noir()", 200);} else { //Si on peut encore rendre plus noir, on rééxécute la fonction
document.all.TheText.innerHTML=""; //Sinon, c'est finit, et donc on enlève tout le texte (la cmd <cls>)
AddCAR(); //Et on appele la fonction AddCAR()
}
}
function doRapid_Fondu_noir() { //Le fondu noir rapide, bon pas la peine d'éxpliquer
document.all.TheText.innerHTML="<font color=\"00" + conversion(FonduLev) + "00\">" + Txt + "</font>";
FonduLev=FonduLev-5; //Seule différence : plus rapide pour ce fondu
if (FonduLev>0) {setTimeout("doRapid_Fondu_noir()", 41);} else {
document.all.TheText.innerHTML="";
setTimeout("AddCAR()", Math.round(Math.random()*1)+1);
}
}
setTimeout("AddCAR()", 1); //Pour démarrer la fonction AddCAR
//-->
</script>
<bgsound src="ODYSSEY.MID" loop="0">
</head>
<!--
Bon là haut dessus, c'est pour le midi (Vous connaissez)
En bas, le scoll="no" permet de ne pas afficher le scroll bar dans la page
//-->
<body bgcolor="#000000" text="#00FF00" link="#0000FF" vlink="#0000FF" alink="#FF0000" scroll="no">
<form name="Mattrix">
<script language="Javascript">
<!--
var R, V, B; //Bon, on créé des variables pour le rouge, le vert, le bleu
for (var i=1;i<NumMattrix+1;i++) { //Une boucle pour chaque matrix
document.write('<div id="car'+i+'s" style="position: absolute; left: 100; top:0;z-index:-1;">'); //On fait un div, qui aura un nom diférent pour chaque, et qui pourrat être positionné où l'on veut
document.write('<table border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse">'); //On créé un tableau dans lequel on va mettre chaque caractère de la matrix
for (var j=0;j<10;j++) { //La boucle
V=j/10*255 //On met un niveau de vert qui va du noir au vert.
if (j>=7) { //Si le num du car est + ou égal à 7
R=(j-7)/3*255; //On met du rouge et du vert en
B=(j-7)/3*255; //plus pour faire plus clair encore
} else {
R=0; //Sinon on remet le vert
B=0; //et le rouge à 0
}
document.write(' <tr><td><b><font face="Symbol" size="4" color="#'+conversion(R)+conversion(V)+conversion(B)+'"><div id="car'+i+j+'s">W</div></font></b></td></tr>\n'); //On ajoute dans le tableau le caractère
}
document.write('</table>'); //On ferme le tableau
document.write('</div>'); //On ferme le div
}
//-->
</script>
<p> </p>
<p> </p>
<p><font face="Courier New"><div id="TheText"></div></font></p>
</form>
</body>
<script language="Javascript">
<!--
for (var a=1;a<NumMattrix+1;a++) { //On initialise toutes les matrix
Top[a]=-220; //On les mets en haut, encore invisible car trop haut.
Left[a]=Math.round(Math.random()*document.body.clientWidth); //On le place au hasard sur la gauche
Vit[a]=Math.round(Math.random()*15)+10; //On leur met une vitesse au hasard
}
ChangeCARS(); //On démarre la fonction qui déplace les matrix, et change leurs caractères.
//-->
</script>
</html>
Conclusion :
Il reste encore beaucoup de bugs, et il a encore beaucoup de choses a rajouter (Commandes pour le texte TypeWriter)
Vous n'êtes pas encore membre ?
inscrivez-vous, c'est gratuit et ça prend moins d'une minute !
Les membres obtiennent plus de réponses que les utilisateurs anonymes.
Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.
Le fait d'être membre vous permet d'avoir des options supplémentaires.