Question

我制作导航功能，将导航默认图像更改为悬停图像。

默认图片名称为“main.png”，悬停图片为“main_hover.png”

我知道如何通过jquery的帮助从html src属性中提取图像名称，但我知道如何在文件名“main”和文件扩展名“.png”之间添加额外的字符串

到目前为止我的代码：

$(document).ready(function(){
    $(".nav").hover(function(){
        var default_button = this.src;
        // here is part where i need help with adding "_hover" to default_image
        $(this).attr('src', default_button) // i know i need this after image is not hovered
    });
});

Answer 1

可能你不应该通过jQuery这样做，为什么不使用css方式？

.nav {
 background: url(/path/to/main.png)
}

.nav:hover {
  background: url(/path/to/main_hover.png)
}

Answer 2

$(document).ready(function(){
    $(".nav").hover(function(){
        var default_button = this.src.replace(".jpg","_hover.jpg");
        $(this).attr('src', default_button) 
    });
});

用于导航的jquery .hover（）

2 个答案: