onmouseover image swap in different location on page

I have a script that has an onmousemover effect that displays the image in a different location in the same page.  I would like this to be another image, rather than the one that I just rolled over.  
<script type="text/javascript">
function showIt(imgsrc)
{
document.getElementById('imageshow').src=imgsrc;
}
 
function hideIt()
{
document.getElementById('imageshow').src="aliceyoga.jpg";
}
</script>
 
<body>
<img src="images/step1.jpg" onmouseover="showIt(this.src)" onmouseout="hideIt()"><br>
<img src="images/STEP2.jpg" onmouseover="showIt(this.src)" onmouseout="hideIt()">
</body>

Open in new window

katieflygirlAsked:
Who is Participating?
 
sh0eConnect With a Mentor Commented:
Need more information.

If you want it to show different images, you need to call showIt() with a different image name.
Such as onmouseover="showIt('path/to/image.jpg')"
<script type="text/javascript">
function showIt(imgsrc)
{
document.getElementById('imageshow').src=imgsrc;
}
 
function hideIt()
{
document.getElementById('imageshow').src="aliceyoga.jpg";
}
</script>
 
<body>
<img src="images/step1.jpg" onmouseover="showIt(this.src)" onmouseout="hideIt()"><br>
<img src="images/STEP2.jpg" onmouseover="showIt(this.src)" onmouseout="hideIt()">
</body>
 
<img id="imageshow"/>

Open in new window

0
 
katieflygirlAuthor Commented:
That's what I needed.  Thank you!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.