<分区>
我知道解决方案过于愚蠢,但我没有找到它:/ 我正在寻求简化此 js 代码。
但我特别希望了解,所以如果您有学习简化的链接。
我开始编写 JS,所以不要对我评价太多;)
提前致谢。
代码Js:
$('#img1, #menu1').hover(
function() {
$('#menu1').toggleClass("activeMenu");
$('#img1').toggleClass("activeImg");
});
$('#img2, #menu2').hover(
function() {
$('#menu2').toggleClass("activeMenu");
$('#img2').toggleClass("activeImg");
});
$('#img3, #menu3').hover(
function() {
$('#menu3').toggleClass("activeMenu");
$('#img3').toggleClass("activeImg");
});
$('#img4, #menu4').hover(
function() {
$('#menu4').toggleClass("activeMenu");
$('#img4').toggleClass("activeImg");
});
$('#img5, #menu5').hover(
function() {
$('#menu5').toggleClass("activeMenu");
$('#img5').toggleClass("activeImg");
});
HTML 代码:
<ul>
<li id="menu1">Module Accueil</li>
<li id="menu2">Module Produit</li>
<li id="menu3">Module Diaporama</li>
<li id="menu4">Module Article</li>
<li id="menu5">Module Contact</li>
</ul>
<img id="img1" src="/themes/courant/images/image1">
<img id="img2" src="/themes/courant/images/image2">
<img id="img3" src="/themes/courant/images/image3">
<img id="img4" src="/themes/courant/images/image4">
<img id="img5" src="/themes/courant/images/image5">