Adaptation code IE vers Netscape, Mozilla, Firefox

[rallierst]

Bonjour,
Je cherche à adaptée le code suivant qui fonctionne très bien sur IE vers les navigateurs Netscape, Mozilla, FireFox.


<table width="530" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>
<td height="164"><div align="center" ><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">
<a href="indexFR.html" target="_self" name="lien"><img src="images/pays/france.jpg" name="img" border="0" ></a><br>
<br>
Pour Entrer <br>
cliquez sur la touche "<u><strong><em>entrée</em></strong></u>"
</font></div></td>
<td><div align="center"> </div></td>
<td><div align="center"><font color="#FFFFFF" size="2" face="Arial, Helvetica, sans-serif">
<a href="indexEN.html" target="_self" name="lien"><img src="images/pays/Anglais.jpg" name="img" border="0"></a><br>
<br>
For Enter<br>
click the touch "<strong><em><u>entry</u></em></strong>" </font></div></td>
</tr>
</table>

<script language="JavaScript" type="Text/JavaScript">
<!--
var lienval=new Array(
"images/pays/france2.jpg",
"images/pays/Anglais2.jpg"
); //========== table des images pour les liens valides

var lieninv=new Array(
"images/pays/france.jpg",
"images/pays/Anglais.jpg"
); //========== table des images pour les liens invalides

for (var n=0;n<lien.length;n++)
{ img[n].src=lieninv[n]; } // initialisation des images

var adr=lien.length-1;

function clavier() // frappe sur une touche
{ if (event.keyCode==13) lien[adr].click(); }

function suivant() // passer au lien suivant
{ img[adr].src=lieninv[adr];
adr++;
if (adr>=lien.length) adr=0;
img[adr].src=lienval[adr];
setTimeout("suivant();",3000); }
suivant();
document.onkeypress=clavier;
//-->
</script>


Le principe est simple, des images clignotent, et lorsque que l'on valide par la touche entrée on valide le lien associé à l'image.

Merci pour votre aide, c'est pour une association.

[SB]

<script type="text/javascript">
<!--
var lienval=new Array(
"images/pays/france2.jpg",
"images/pays/Anglais2.jpg"
); //========== table des images pour les liens valides

var lieninv=new Array(
"images/pays/france.jpg",
"images/pays/Anglais.jpg"
); //========== table des images pour les liens invalides

for (var n=0;n<2;n++)
{ document.img[n].src=lieninv[n]; } // initialisation des images

var adr=1;

function clavier() // frappe sur une touche
{ if (event.keyCode==13) lien[adr].click(); }

function suivant() // passer au lien suivant
{ document.img[adr].src=lieninv[adr];
adr++;
if (adr>=2) adr=0;
document.img[adr].src=lienval[adr];
setTimeout("suivant();",3000); }
suivant();
document.onkeypress=clavier;
//-->
</script>

[rallierst]

Excellent, cela fait des semaines que je cherche cette adaptation. Par contre, la fonction clavier pour la frappe sur la touche "entrée" ne fonctionne que sur IE.

function clavier() // frappe sur une touche
{ if (event.keyCode==13) lien[adr].click(); }

As-tu une réponse ?

[Benoit]

SVP utilisez les balises "code" pour que ça reste lisible.

[PsyDk]

La fonction d'évènement clavier est différente selon IE ou autre :

Code : Tout sélectionner

function OnKeyPressed(event)
{
	var nKeyCode;

	if( document.all)
	{
		// Internet Explorer :-(
		nKeyCode = window.event.keyCode;
	}
	else
	{
		// Cool browser ;-)
		nKeyCode = event.which;
	}

	if ( nKeyCode == 13 ) // Touche Entrée
	{
		// Fait des trucs
	}
}

// Fixe le handler pour détecter la pression d'une touche du clavier
document.onkeypress = OnKeyPressed;

[Invité]

Voila ce que j'ai fait. Tout fonctionne correctement sauf la frappe clavier, qui ne fonctionne que sous IE. Par contre dois-je mettre les balises "Layers" à mes images.

<script type="text/javascript">
<!--
var lienval=new Array(
"images/pays/france2.jpg",
"images/pays/Anglais2.jpg"
); //========== table des images pour les liens valides

var lieninv=new Array(
"images/pays/france.jpg",
"images/pays/Anglais.jpg"
); //========== table des images pour les liens invalides

for (var n=0;n<2;n++)
{ document.img[n].src=lieninv[n]; } // initialisation des images

var adr=1;

function clavier(event) {// frappe sur une touche
if(document.all){//it's IE
var whichkey = window.event.keyCode;
}
else if(document.layers){//it's netsacpe
var wichkey = event.which;
}
{ if (whichkey==13) lien[adr].click(); }
}


function suivant() // passer au lien suivant
{ document.img[adr].src=lieninv[adr];
adr++;
if (adr>=2) adr=0;
document.img[adr].src=lienval[adr];
setTimeout("suivant();",3000); }
suivant();
document.onkeypress=clavier;
//-->
</script>

[rallierst]

Voila ce que j'ai fait. Tout fonctionne correctement sauf la frappe clavier, qui ne fonctionne que sous IE. Par contre dois-je mettre les balises "Layers" à mes images.

Code : Tout sélectionner

<script type="text/javascript"> 
<!-- 
var lienval=new Array( 
"images/pays/france2.jpg", 
"images/pays/Anglais2.jpg" 
); //========== table des images pour les liens valides 

var lieninv=new Array( 
"images/pays/france.jpg", 
"images/pays/Anglais.jpg" 
); //========== table des images pour les liens invalides 

for (var n=0;n<2;n++) 
{ document.img[n].src=lieninv[n]; } // initialisation des images 

var adr=1; 

[color=red]function clavier(event) {// frappe sur une touche 
if(document.all){//it's IE 
var whichkey = window.event.keyCode; 
} 
else if(document.layers){//it's netsacpe 
var wichkey = event.which; 
} 
{ if (whichkey==13) lien[adr].click(); } 
} [/color]


function suivant() // passer au lien suivant 
{ document.img[adr].src=lieninv[adr]; 
adr++; 
if (adr>=2) adr=0; 
document.img[adr].src=lienval[adr]; 
setTimeout("suivant();",3000); } 
suivant(); 
document.onkeypress=clavier; 
//--> 
</script>

[Bobe]

pourquoi as-tu ajouté la condition if( document.layers) ?

document.layers est obsolète et reconnu que par netscape 4.x.

La bonne méthode:

Code : Tout sélectionner

function clavier(evt) {// frappe sur une touche
var key = null;
if( evt )
{
    key = evt.which;
}
else
{
    key = window.event.keyCode; // MS
}

if (key==13) lien[adr].click();
}

[PsyDk]

La bonne méthode:

Et plutôt deux fois qu'une. J'espère que tu n'es pas invisible comme moi

[rallierst]

La frappe clavier fonctionne bien sous IE, mais pas avec FireFox.

Code : Tout sélectionner

function clavier(evt) {// frappe sur une touche
var whichkey = null;
if(evt){//it's netsacpe
	wichkey = evt.which;
	}
else{//it's IE
	whichkey = window.event.keyCode;
	}
if (whichkey==13) lien[adr].click();
}

[PsyDk]

Meuh si, ça fonctionne très bien ^^ La méthode de Bobe est même meilleure que la mienne puisqu'elle teste l'existence du paramètre d'événement au lieu de tester le document.all.

Code : Tout sélectionner

if(evt){//it's netsacpe
   wichkey = evt.which;

<-- t'as oublié un « h » dans le nom de variable. C'est « whichkey ».

[rallierst]

Je suis vraiment désolé, mais ici avec FireFox, cela ne fonctionne pas. J'avais bien vu cette erreur et même en la modifiant, cela ne change rien.
Par contre, au niveau de mes balises consernant les liens sur les images, il n'y a rien à faire ?

Code : Tout sélectionner

<script type="text/javascript"> 
<!-- 
var lienval=new Array( 
"images/pays/france2.jpg", 
"images/pays/Anglais2.jpg" 
); //========== table des images pour les liens valides 

var lieninv=new Array( 
"images/pays/france.jpg", 
"images/pays/Anglais.jpg" 
); //========== table des images pour les liens invalides 

for (var n=0;n<2;n++) 
{ document.img[n].src=lieninv[n]; } // initialisation des images 

var adr=1; 

function clavier(evt) {// frappe sur une touche
var whichkey = null;
if(evt){//it's netsacpe
	whichkey = evt.which;
	}
else{//it's IE
	whichkey = window.event.keyCode;
	}
if (whichkey==13) lien[adr].click();
}


function suivant() // passer au lien suivant 
{ document.img[adr].src=lieninv[adr]; 
adr++; 
if (adr>=2) adr=0; 
document.img[adr].src=lienval[adr]; 
setTimeout("suivant();",3000); } 
suivant(); 
document.onkeypress=clavier; 
//--> 
</script>

[/code]

[rallierst]

J'ai testé le code de la frappe clavier sous mozilla 1.7.3, mozilla FireFox 1, Netscape 7, et celui-ci ne fonctionne pas. Il n'y a que sous IE que cela passe super bien.

[PsyDk]

Euh... Aurais-tu un exemple complet à fournir quelque part s'il te plait ? Un lien avec la page, les images... ça serait plus facile d'étudier ça.

[Bobe]

ah, je crois que je comprend où est le problème.

Ta fonction clavier(), tu l'appelles où ? dans un attribut d'évènements html ? ( <balise onclick="..."> par exemple)
Car dans ce cas, tu reçois l'objet d'évènements à cet endroit là, et tu dois faire simplement:

<balise onclick="clavier(event);"> par exemple.

Et la fonction clavier() adaptée à cette situation:

Code : Tout sélectionner

function clavier(evt) {// frappe sur une touche
var whichkey = null;
if(evt.which){//it's netsacpe
   whichkey = evt.which;
   }
else{//it's IE
   whichkey = evt.keyCode;
   }
if (whichkey==13) lien[adr].click();
} 

J'espère que tu n'es pas invisible comme moi

J'ai dù manquer un épisode là