Rechercher : dans
Par :

Problème un javascript avec onMouseOver

Dernière réponse le 29 mar 2008 à 15:23:01 camille, le 29 mar 2008 à 11:02:10 
 Signaler ce message aux modérateurs

Bonjour,
je débute en JavaScript et je n'arrive pas à faire fonctionner mon script.
Voici ce que je veux faire: j'ai un tableau dont les cases sont des images, et je vouidrai que lorsqu'on passe la souris sur une des cases du tableau (une image donc), une petite explication apparaisse sur un petit encadré à côté du tableau.


donc je crée une variable "explication", chaine de caractères, qui a au début pour valeur "Passez la souris sur une case du tableau"

Après je fais une fonction (déclarée dans l'entête) pour chaque case du tableau, qui vise à transformer le texte de la variable "explication", pour y mettre à la place l'un texte décrivant la case concernée.

Je fais appel à ces fonction dans les cases du tableau correspondantes, avec l'évènement OnMouseOver.

Et enfin, j'affiche dans le petit encadré, le contenu de la variable "explication".




Pouvez vous me dire quel est le problème avec mon script:, le voilà:
<HEAD>
(...)
<SCRIPT language="JavaScript">
explication= new String("Passez la souris sur une case de votre choix");
function Case1(explication) {explication="texte qui décrit la case 1"}
function Case2(explication) {explication="texte qui décrit la case 2"}
/*(etc... autant de fonctions que de cases*/
</SCRIPT>
(...)
</HEAD>

<BODY>
(...)

<table>
<tr>
<td> <IMG SRC="case1.GIF" onMouseOver="Case1(explication)"> </td>
<td> <IMG SRC="case2.GIF" OnMouseOver="Case2(explication)"> </td>
//(etc...)
</table>

/*Encadré (tableau à une ligne et une colonne) qui suit le tableau:*/
<tABLE >
<tr> <td>
<U> Explication: </U>
<BR>
<script language=JavaScript> document.write(expli) </script>
</td> </tr>
</TABLE>

(...)
</BODY>



Problème: au début il y a bien dans l'encadré la valeur de départ de "explication" ("Passez la souris sur une case de votre choix"), mais après si je passe la souris sur une case du tableau, ça n'a aucun effet.

Merci d'avance à tous ceux qui pourraient m'aider à résoudre ce problème.

Configuration: Windows XP
Internet Explorer 6.0

Meilleures réponses pour « Problème un javascript avec onMouseOver » dans :
[mythe] JavaScript c'est la même chose que Java Voirmythe Javascript est le même langage que Java Réalité FAUX Explications Ces deux langages existent bien, et ce sont tous les deux des langages de programmation (moins poussée pour le JavaScript), mais ce ne sont pas les mêmes...
Javascript - Afficher un message d'au-revoir aux visiteurs VoirIl est parfois très plaisant d'afficher un message en remerciant les visiteurs de votre site de leur passage. Cette astuce a pour but de vous montrer comment s'y prendre. 1.La fonction JavaScript 2.Appel du Script 1.La fonction...
Javascript - La notion d'objet VoirNotion d'objet Le but de cette section n'a pas pour ambition de traîter de la programmation orientée objet mais de donner une idée de ce qu'est un objet, concept nécessaire à la création de scripts Javascript. Le Javascript traite les éléments qui...
Javascript - Les variables VoirLe concept de variable Une variable est un objet repéré par son nom, pouvant contenir des données, qui pourront être modifiées lors de l'exécution du programme. En Javascript, les noms de variables peuvent être aussi long que l'on désire,...
Javascript - L'objet window VoirLes particularités de l'objet window L'objet window est l'objet par excellence dans Javascript, car il est le parent de chaque objet qui compose la page web, il contient donc : l'objet document: la page en elle-même l'objet location: le lieu de...

1

carbon3, le 29 mar 2008 à 13:31:44

Salut,
tiens je t'ai réécris ton code pour que cela fonctionne. Tu vois c'est un peu plus léger comme ça, non ?
ah, tu feras gaffe aux src des img, j'ai changé les valeurs pour tester chez moi.

<html>
<HEAD> 

<SCRIPT language="JavaScript"> 
explication= new Array("Passez la souris sur une case de votre choix","texte qui décrit la case 1","texte qui décrit la case 2"); 

function Any_Case(flag) {
	document.getElementById('explik_td').innerHTML=explication[flag];
} 
function Blank_Case() {
	document.getElementById('explik_td').innerHTML=explication[0];
}
</SCRIPT>

</HEAD> 
<BODY>

<table>
<tr>
<td><IMG SRC="image1.ext" onMouseOver="Any_Case(1)" onMouseOut="Blank_Case()"></td>
<td><IMG SRC="image2.ext" OnMouseOver="Any_Case(2)" onMouseOut="Blank_Case()"></td>
</tr>
</table>

<table>
<tr><td id="explik_td">
<U> Explication: </U> 
<BR>
</td></tr> 
</TABLE> 
<script language="javascript">
document.getElementById('explik_td').innerHTML=explication[0];
</script>
</BODY>
</html>

Répondre à carbon3

2

 camille, le 29 mar 2008 à 15:23:01

Ok, merci beaucoup, ça a marché;
bon weekend

Répondre à camille