Menu déroulant getElementsById
Bonjour,
Je suis entrain de réaliser mon menu déroulant pour mon site. Le problème est que je n'arrive pas à sélectionner une class dans mon HTML avec mon JS. En effet, je me suis aidé d'un tuto. J'ai compris le code. J'ai cependant tenté de sélectionner un class grâce à getElementsByClassName mais impossible.
Voici mon code:
HTML:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22
| <div id="menu">
<ul class="menu-content">
<li>
<a href="#">accueil</a>
<ul class="sub-menu">
<li> <a href="#"> Test 1 </a> </li>
<li> <a href="#"> Test 2 </a> </li>
</ul>
</li>
<li>
<a href="#">Contact</a>
<ul class="sub-menu">
<li> <a href="#"> Test 1 </a> </li>
<li> <a href="#"> Test 2 </a> </li>
<li> <a href="#"> Test 3 </a> </li>
<li> <a href="#"> Test 4 </a> </li>
<li> <a href="#"> Test 5 </a> </li>
<li> <a href="#"> Test 6 </a> </li>
</ul>
</li>
</ul>
</div> |
JS:
Code:
1 2 3 4 5 6 7 8 9 10 11 12
| sfHover = function() {
var sfEls = document.getElementsByClassName("sub-menu").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover); |
Merci