Question

你好我使用jQuery很新，我试图创建一个菜单，当你浏览链接时显示不同的图片。它将显示一张图片并隐藏其他4张图片，当您将鼠标移开链接时，它将返回默认图片。我正在使用悬停功能，但有时当我将鼠标移动到底部时，两个图像（与链接和默认相关的图像）都显示出来，我想知道是否有一些检查我可以做以确保这一点没发生。这是我的代码的样子。

    $("#blog-img").hide();
    $("#contact-img").hide();
    $("#headturner-img").hide();
    $("#work-img").hide();

    $("#blog").hover(
        function(){
                    $("#default").hide();
            $("#contact-img").hide();
            $("#headturner-img").hide();
            $("#work-img").hide();
            $("#blog-img").show("slow");
        },
        function(){
            $("#blog-img").hide();
            $("#default").show("slow");    
           }
    );

我很乐意得到任何帮助。

Answer 1

您可能通过使用计时来显示图像来创建竞争条件。

当显示两个图像时，可能是因为在第一个执行的图像完成之前已经执行了至少一个Shows。当您使用悬停小数移动 - 我们正在谈论像素 - 进入/移出对象时，就会发生这种情况。

我建议使用CSS来解决此问题。它比使用Javascript更清晰。

jQuery显示/隐藏问题

1 个答案: