J'avoue tout de suite, je n'ai pas encore commencé le cours de javascript et mis à part le livre que j'ai englouti sur la question, je n'ai pas beaucoup de références.

J'ai créé une liste à puces pour mon menu, les puces étant des images, l'ID de mes List Items "tetine". Pour faire court, voila l'extrait de mon code XHTML concernant le menu :

<div id="menu">
<p>
<ul>
<li id="tetine"><a href="edouard.html">Edouard</a></li>
<li id="tetine"><a href="arbre.html">L'arbre</a></li>
</ul>
</p>
</div>

Voici l'extrait de mon fichier CSS s'y rattachant :

li
{
list-style-image: url("images/tetine.png");
padding-top: 15px;
margin-left: 30px;
}

J'aimerai remplacer l'URL du List Style Image de mes puces lors de l'évènement "onmouseover" et bien sur que les puces redeviennent "tetine.png" onmouseout.

J'ai créé un fichier javascript que j'ai trafiqué sans succès toute la matinée et qui donne en ce moment :

document.getElementById("tetine").onmouseover = menu;

function menu()
{
document.getElementById("tetine").style.listStyleImage="url('images/tetineanim2.gif')";
}


J'imagine que ma question est très basique, mais si quelqu'un pouvait me répondre, ca serait super!
Merci.

L'id doit être unique, or tu l'utilises pour deux éléments. Utilise plutôt getElementsByTagName("li") ou getElementsByClassName à la place de getElementById

Sinon, pour faire ce genre de chose il est bien plus simple d'utiliser CSS que javascript :

li
{
  list-style-image: url("images/tetine.png");
  padding-top: 15px;
  margin-left: 30px;
}

li:hover
{
  list-style-image: url("images/tetineanim2.png");
}

Mais oui, je suis tellement en train d'essayer d'apprendre le Javascript que je n'ai même pas pensé à le faire en CSS !!!

Merci beaucoup !!!