Soyez le premier à donner votre avis sur cette source.
Vue 15 415 fois - Téléchargée 429 fois
<html> <head> <TITLE>Trois flèches pour 3 liens - link, visited, hover</TITLE> <META content="Trois liens, link, visited, hover .../... pour 3 flèches de couleur" name=description> <META content="Nocturne - @2003" name=author> <style type=text/css> .Bleu, .Rouge, .Gris {text-size:11px;cursor:hand;} .Bleu{color:blue;} .Rouge{color:red;} .Gris{color:#999999;} A:link{COLOR:blue;} A:visited{COLOR:#999999;} A:hover{COLOR:red;background-color:#FFFF99;} A:active{COLOR:red;} </style> <script type="text/javascript" language="JavaScript"> var Couleur=""; var ImageObjet=""; function souris_click(objet) { objet.className='Gris'; document.all(objet.fleche).src='Gris.gif'; } function souris_over(objet) { Couleur = objet.className; //Mémorisation de la couleur pour souris out objet.className = 'Rouge'; //Initialisation de la class à rouge ImageObjet = eval("document." + objet.fleche + ".src"); //Mémorisation du chemin de la flèche pour souris out eval("document.all." + objet.fleche + ".src='Rouge.gif'"); //Alignement flèche rouge } function souris_out(objet) { if(objet.className !='Gris') { objet.className = Couleur; eval("document.all." + objet.fleche + ".src='" + ImageObjet + "'"); } } function maj_fleche() { //**boucle de mise à jour des flèches de couleurs** var line_number = ""; var nbr_liens=7; //Nombre de liens/flèches +1, maxi=100 donc 99 images flèches for(i=1; i<nbr_liens; i++) { //Boucle de MAJ des flèches if (i<10) {line_number = "0" + String(i);} if (i>9) {line_number = String(i);} switch(document.getElementById("lien_"+ line_number).currentStyle.color) { //Récupère la couleur du lien //Tri du lien en fonction de sa couleur, alignement de la flèche case ("#999999"): //Lien gris document.all("img_" + line_number).src='Gris.gif'; //Flèche gris break; case ("blue"): //Lien bleu document.all("img_" + line_number).src='Bleu.gif'; //Flèche bleu break; case ("red"): //Lien rouge document.all("img_" + line_number).src='Rouge.gif'; //Flèche rouge break; default: //Flèche bleu par défaut document.all("img_" + line_number).src='Bleu.gif'; break; } } } </script> </head> <body bgcolor=white onload="maj_fleche();" link="blue" vlink="#999999" alink="red"> <u>DEMO</u> : <BR><BR> <IMG id=img_01 src="Bleu.gif" name=img_01> <A class="Bleu" id="lien_01" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http:\\www.google.com" target="_self" name="lien_01" fleche="img_01">Google</A> <br> <IMG id=img_02 src="Bleu.gif" name=img_02> <A class="Bleu" id="lien_02" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http://www.javascriptfr.com" target="_self" name="lien_02" fleche="img_02">JavaScript CodesSources</A> <br> <IMG id=img_03 src="Bleu.gif" name=img_03> <A class="Bleu" id="lien_03" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http:\\www.vbfrance.com" target="_self" name="lien_03" fleche="img_03">Visual Basic CodesSources</A> <br> <IMG id=img_04 src="Bleu.gif" name=img_04> <A class="Bleu" id="lien_04" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http:\\www.pmu.fr" target="_self" name="lien_04" fleche="img_04">PMU</A> <br> <IMG id=img_05 src="Bleu.gif" name=img_05> <A class="Bleu" id="lien_05" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http:\\www.sncf.fr" target="_self" name="lien_05" fleche="img_05">SNCF</A> <br> <IMG id=img_06 src="Bleu.gif" name=img_06> <A class="Bleu" id="lien_06" onmouseover="souris_over(this);" onclick="souris_click(this);maj_fleche();" onmouseout="souris_out(this);" href="http:\\www.anpe.fr" target="_self" name="lien_06" fleche="img_06">ANPE</A> <br> </Body> </html>
Rien à dire le code est clair.
Bonne prog à toi.
Nocturne.
Kenavo
a+
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.