Home/ Questions/Q 8373367
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T14:39:36+00:00

I wrote a script which changes the source of an image upon mouse over

  • 0

I wrote a script which changes the source of an image upon mouse over the image,
at first it worked, but after adding a second image which uses the same code both stopped working.

The issue I am experiencing is that the image does not change on mouse over as it should. It looks as if the image is not found – however I am really sure the images’ sources point to the right path.

I have asked for other opinions as well and I cannot see what I am doing wrong. I would really appreciate your help or any input on this.

Below is the code I am using.

<html>
  <head>
    <script type="text/javascript">
      var images= new Array();
      images[0] = "Benjamin/Untitled-3.png";
      images[1] = "Benjamin/Untitled-4.png";
      images[2] = "Benjamin/Update.png";
      images[3] = "Benjamin/Update2.png";

      function Change()
      {
        document.getElementById("image").src = images[1];
      }

      function GoBack()
      {
        document.getElementById("image").src = images[0];
      }

      function GobackAgain()
      { 
        document.GetElementById("Update").src = images[2];
      }

      function ChangeAgain()
      {
        document.getElementById("Update").src = images[3];
      }
    </script>

    <style type="text/css">
      body
      {
        background-color:#1c1a1a;
      }
    </style>

    <div align="center">
      <img src="Untitled-2.png" width="325" height="191">
    </div>

  </head>

  <body>
    <img onmouseover="Change()" 
         onmouseout="GoBack()" 
         id="image" 
         STYLE="position:absolute; TOP:35%; LEFT:10%; WIDTH:204px; HEIGHT:278px" 
         src="Untitled-3.png">

    <img onmouseover="ChangeAgain()" 
         onmouseout="GoBackAgain()" 
         id="Update" 
         STYLE="position:absolute; TOP:35%; LEFT:50%; WIDTH:204px; HEIGHT:278px" 
         src="Update.png">
  </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Rename GobackAgain to GoBackAgain and replace GetElementById with getElementById.

    • 0