0

我是 jQuery 新手，所以我认为这对很多人来说都是微不足道的。我正在制作一个带有子菜单的导航栏，这些子菜单在主菜单悬停时出现。我想更改主菜单的背景图像，同时显示子菜单。这是我的代码：

$('#nav-list li.products').hover(
        功能（） {
            $('#nav-list li.products ul').addClass("hover");
            $(this).css("背景图片","url(img/products-hover.png)");

        },
        功能（） {
            $('ul', this).removeClass("hover");
            $(this).css("背景图片","url(img/products.png)");
        }
    );

此代码仅显示子菜单，但不更新主菜单的样式。我怎样才能在 jQuery 中实现这一点？谢谢！

4

1 回答 1

0 
$(this).css("background-image","url(img/products-hover.png)");

上面的代码将添加background-image: url(img/products-hover.png到当前网页的 DOM 中。
所以我想图像img/products-hover.png可能与 css 文件相关，但可能与当前 URL 无关。

尝试使用相对于根路径的 URL，/img/products-hover.png或者在这种情况下我更喜欢绝对路径，例如http://www.example.com/img/products-hover.png

例子

$('#nav-list li.products').hover(
        function() { 
            $('#nav-list li.products ul').addClass("hover");
            $(this).css("background-image","url(http://www.example.com/img/products-hover.png)"); 

        },
        function() {
            $('ul', this).removeClass("hover");
            $(this).css("background-image","url(http://www.example.com/img/products.png)");
        }
    );
于 2011-03-04T11:22:24.450 回答