I have this code to give me a rollover on submit buttons, and I'm trying to make it more generic:
$('.rollover').hover(
function(){ // Change the input image's source when we "roll on"
srcPath = $(this).attr("src");
srcPathOver = ???????
/*need to manipulate srcPath to change from
img/content/go-button.gif
into
img/content/go-button-over.gif
*/
$(this).attr({ src : srcPathOver});
},
function(){ // Change the input image's source back to the default on "roll off"
$(this).attr({ src : srcPath});
}
);
Two things really,
I want to learn how manipulate the srcPath
variable to append the text '-over' onto the gif filename, to give a new image for the rollover. Can anyone suggest a way to do this?
Also, can someone tell me if this code could be refined at all? I'm a bit new to jQuery and wondered if the syntax could be improved upon.
Many thanks.
$('.rollover').hover(
function(){ // Change the input image's source when we "roll on"
var t = $(this);
t.attr('src',t.attr('src').replace(/([^.]*)\.(.*)/, "$1-over.$2"));
},
function(){
var t= $(this);
t.attr('src',t.attr('src').replace('-over',''));
}
);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With