jquery .hover（）导航

Question

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

默认图像名称是“main.png”和悬停图片是“main_hover.png”

我知道如何从HTML src属性的jQuery的帮助下提取图像的名字，但我倒知道如何添加额外的

$(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

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

Answer 2

可能是你不应该通过jQuery做到这一点，为什么不使用CSS道：“png格式”

我到目前为止的代码文件名“主”和文件扩展名之间的字符串？

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

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