11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour.
je suis tellement nul en javascript que je n'arrive même plus à modifier le style d'une image se trouvant dans un lien. (c'est pour faire un genre de rollover à distance sur une liste de plusieurs liens)

<li><a href='#' onMouseOver='document.getElementsById(4).className="style"' ><img src='image.png'  id='4'  alt='blabla' /></a></li>


Merci

EDIT : précisions =>Le lien fait 64px sur 180px. Ce lien contient une image miniature de 16px sur 16px qui change d'aspect au survol. Malheureusement le hover ne se déclenche que lors du survol de l'image, et non lors du survol de la globalité du lien.
Je pense que je suis obligé d'utiliser javascript pour ça.
Modifié par Ralfman68 (23 Oct 2006 - 06:30)
Deux remarques préliminaires :
1. les attributs HTML se délimitent normalement toujours avec des guillemets même si les navigateurs reconnaissent les valeurs délimitées par des apostrophes.
2. Un identificateur id="..." doit commencer par une lettre a-zA-Z, un souligné (underscore) ou un signe dollar mais pas un chiffre.
Merci Quentin pour ces subtilités syntaxiques que j'ignorais.
Une fois ces "détails" corrigés, je me retrouve avec un code du style :
		
<li><a href='#' onMouseOver='document.getElementById('id4').className="style"' ><img src='pic.png'  id='id4'  alt='vide' /></a></li>


Au mieux il ne se passe rien, au pire c'est le lien entier qui prend le style...

Smiley bawling
Tu n'as quand même pas compris ce que je disais avec les apostrophes :

Nous sommes d'accord, tu as ça :
onMouseOver='document.getElementById('id4').className="style"'
Tu commets une erreur en utilisant des apostrophes dans un code javascript présent dans un attribut délimité lui-même avec des apostrophes.

Certains navigateurs, sinon tous, comprendront ça comme ça (ça dépend des expressions régulières qu'ils utilisent dans leur moteur d'interprétation (X)HTML) :
onMouseOver='document.getElementById('
Pas étonnant, donc, que ça ne fonctionne pas.

Tu as deux alternatives : délimiter la valeur de l'attribut avec des apostrophes et n'utiliser que des guillemets dans le code, ou mieux, délimiter la valeur de l'attribut avec des guillemets et n'utiliser que des apostrophes dans le code. On peut toujours échapper les quotes en javascript, mais en HTML il ne vaut mieux pas le faire.
C'est à toi de voir, je te conseille viement la deuxième qui est plus conforme quela première.

Je te laisse corriger...

Remarque en passant, tu aurais moins de problème en utilisant des scripts en fichier externe.
Modifié par QuentinC (23 Oct 2006 - 06:22)
Maintenant que tu le dis, ça saute aux yeux.

Le problème est que ce script est imbriqué dans une boucle php pour déterminer le nom de l'id à traiter en javascript, prions le Seigneur que j'arrive à décortiquer ce schmilblick.
Ralfman68 a écrit :
Maintenant que tu le dis, ça saute aux yeux.

Le problème est que ce script est imbriqué dans une boucle php pour déterminer le nom de l'id à traiter en javascript, prions le Seigneur que j'arrive à décortiquer ce schmilblick.

Là ça dépend comment tu rédiges ton code PHP. Le mieux est un truc du style :
 // Bordel PHP
?>
<li><a href='#' onMouseOver='document.getElementById("<?php echo $id ?>").className="style"' ><img src='<?php echo $id ?>'  id='id4'  alt='vide' /></a></li>
<?php
  // La suite