Discussion :

[NastyG88]

Salut les informaticiens !

Je vous donne le java script avec lequel je souhaite travailler:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<script type="text/javascript">
function mouseOver()
{
document.getElementById("b1").src ="b_blue.gif";
}
function mouseOut()
{
document.getElementById("b1").src ="b_pink.gif";
}
</script>

Il me suffit maintenant de mette id="b1" dans la balise <A> de l'image.

Ce que j'essaye de faire c'est d'utiliser ce même script pour plusieurs image sur une même page sachant qu'à chaque fois les deux image mouseOver et mouseOut sont différents.

Je joint le code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 <script type="text/javascript">
<!--
function mouseOver()
{
document.getElementById("cat").src ="Catalogue_General_2.jpg";
}
function mouseOut()
{
document.getElementById("cat").src ="Catalogue_General.jpg";
}
//-->
  </script>
  <script type="text/javascript">
<!--
function mouseOver()
{
document.getElementById("V12").src ="V12_2.jpg";
}
function mouseOut()
{
document.getElementById("V12").src ="V12.jpg";
}
//-->
  </script>

J'ai ensuite ajouté 2 image avec des balises <A> et id"cat" dans la première et id"V12" dans la seconde.

Mais visiblement cela ne fonctionne pas !

J'imagine bien qu'il n'est pas nécessaire de répéter <script type="text/javascript"> mais alors comment placer les foncions dans le script ?

Je compte sur vous pour m'aider

[Bovino]

Salut,
il n'est surtout pas possible de créer plusieurs fonctions avec le même nom...

[NastyG88]

Oui. Je l'avais bien compris !

Ce forum est vraiment très pratique; J'y ai trouvé la solution suivante:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<img id='img' src="ImgDepart.gif" border=0
onmouseover="document.getElementById('img').src='ImgDessus.gif'"
onmouseout="document.getElementById('img').src='ImgDepart.gif'">

Je peux donc ajouter un onmousever/out diffèrent pour chaque image !!!

Est-ce la bonne solution ? Pour moi cela marche parfaitement sous firefox et ie.

Y-a-t-il autre chose à ajouter (balise script etc..) ?

Merci et bon dimanche

[javatwister]

après, rationnalise un peu tes noms d'image si tu veux être efficace;

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div id="cadre">
<img src="truc.jpg" alt="truc" />
<img src="bidule.jpg" alt="truc" />
<img src="machin.jpg" alt="truc" />
<img src="chose.jpg" alt="truc" />
</div>
 
 
<script type="text/javascript">
 
var im=document.getElementById("cadre").getElementsByTagName("img");
for(i in im){
im[i].init=im[i].src;
im[i].onmouseover=function(){this.src=this.init.split(".")[0]+"_2.jpg"};
im[i].onmouseout=function(){this.src=this.init};
}
 
</script>

dans ce cas, les images initiales se nomment "quelquechose.jpg" et les images de remplacement "quelquechose_2.jpg";

[NastyG88]

Merci

C'est vraiment top le JavaScript en encore plus ce site