JavaScript simple mouse movement to switch between the image method

  • 2021-01-03 20:49:31
  • OfStack

This article illustrates JavaScript's simple method to switch images by mouse movement. To share for your reference, the details are as follows:


<title>JavaScript Switch the picture </title>
<script>
function showDaTu(src){
document.getElementById("defaultImg").src=src;
}
</script>
<img src="images/wall1.jpg" id="defaultImg">
<br><br><br>
<img src='images/wall_s1.jpg' onmouseover="showDaTu('images/wall1.jpg')">
<img src='images/wall_s2.jpg' onmouseover="showDaTu('images/wall2.jpg')">
<img src='images/wall_s3.jpg' onmouseover="showDaTu('images/wall3.jpg')">
<img src='images/wall_s4.jpg' onmouseover="showDaTu('images/wall4.jpg')">
<br> As the picture is large, please wait for the picture to load... Then mouse over the small picture will switch. 

For more information about JavaScript, please refer to: Summary of JavaScript Search Algorithm Skills, Summary of JavaScript Animation Effects and Skills, Summary of JavaScript Errors and Debugging Skills, Summary of JavaScript Data Structure and Algorithm Skills, Summary of JavaScript Traverse Algorithm and Skills, and Summary of JavaScript Mathematical Operation Usage.

I hope this article has been helpful in JavaScript programming.


Related articles: