I want to implement on mouseover display an array of images maybe up to 3 different images then onmouseout the default images is displayed. I've been able to do just single image onmouseover as shown below. How can I implement multiple images?

I want to implement on mouseover display an array of images maybe up to 3 different images then onmouseout the default images is displayed. I've been able to do just single image onmouseover as shown below. How can I implement multiple images?

One of the first keys to your success here is to separate the JavaScript from your HTML content.

The easiest way to do this is to give the image a unique identifier so that the script can then easily refer to that image tag. This can be later on removed depending on how the rest of the your images are structured.

We can now have the script set a data-image value so that it can easily switch back to the original image when the mouseout event occurs, which allows the script to switch the image now without needing to have any URL links in the script.

Are you wanting to setup several images so that only the one that you hover over is the image that changes?or, are you wanting to hover over an image and have several other images change at the same time?