JQuery悬停在分区内的图像上不起作用

JQuery hover on image inside divisions is not working

本文关键字：图像 不起作用 悬停 分区 JQuery      更新时间：2023-09-26

只要悬停但不工作，图像就会发生变化。

HTML

<div style="position:relative" id="banner-container">
<img src="banner-3308.png" data-pin-nopin="true">
<div id="sqm" style="position:absolute; top: 35px; left: 7px">
    <img id="sqm" src="b-3308-2a.png" alt=""/></a>
</div>
<div style="position:absolute; top: 52px; left: 7px">
    <img id="pmlc" src="b-3308-3.png" alt=""/>
</div>
<div style="position:absolute; top: 70px; left: 7px">
    <img id="wireless" src="b-3308-4.png" alt=""/>
</div>
<div style="position:absolute; top: 92px; left: 7px">
    <img id="dst" src="b-3308-5.png" alt=""/>
</div>
<div style="position:absolute; top: 26px; left: 387px">
    <img id="nb" src="b-3308-2b.png" alt=""/>
</div>

JQUERY

<script type="text/javascript">
$(document).ready(fucntion()
{
     $("#banner-container").mouseover(function() {
        $("#sqm").hover(function(e) {
            $(this).attr("src","b-3308-2a-active.png");
        },
        function() {
            $(this).attr("src","b-3308-2a.png");    
        });
        $("#pmlc").hover(function(e) {
            $(this).attr("src","b-3308-3-active.png");
        },
        function() {
            $(this).attr("src","b-3308-3.png"); 
        });
        $("#wireless").hover(function(e) {
            $(this).attr("src","b-3308-4-active.png");
        },
        function() {
            $(this).attr("src","b-3308-4.png"); 
        });
        $("#dst").hover(function(e) {
            $(this).attr("src","b-3308-5-active.png");
        },
        function() {
            $(this).attr("src","b-3308-5.png"); 
        });
        $("#nb").hover(function(e) {
            $(this).attr("src","b-3308-2b-active.png");
        },
        function() {
            $(this).attr("src","b-3308-2b.png");    
        });
    });
});

我不知道为什么它不起作用。

您的代码中有拼写错误。否则，您的代码正在工作。

而不是CCD_ 1使用CCD_。这里的功能拼写错误。

你的第一个图像不起作用，因为你没有给它悬停效果。

工作Fiddle

相关文章：