Question

i make navigation function that changes navigation default image to hover image.

default image name is “main.png” and hover image is “main_hover.png”

i know how to extract image name from html src attribute by help of jquery, but i down know how to add additional string between file name “main” and file extension “.png”

my code so far:

$(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) 
    });
});