how to change image onmouseover javascript code example
Example 1: javascript onmouseover change image
let img = document.querySelector('img');
let start = img.src;
let hover = img.getAttribute('data-hover'); //specified in img tag
img.onmouseover = () => { img.src = hover; }
img.onmouseout = () => { img.src = start; } //to revert back to start
Example 2: javascript swap images on mouseover
function rollover(my_image)
{
my_image.src = 'images/costAnalysisBtn2.png';
}
function mouseaway(my_image)
{
my_image.src = "images/costAnalysisBtn1.png";
}
onmouseover="rollover(this)" onmouseout="mouseaway(this)"