Home/ Questions/Q 6750303
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T12:47:30+00:00

So far I created an array with 11 images, initialized the counter, created a

  • 0

So far I created an array with 11 images, initialized the counter, created a function, created a for loop but here is where I get lost. I looked at examples and tutorial on the internet and I can see the code is seeming simple but I’m not getting something basic here. I don’t actually understand how to call the index for the images. Any suggestions. Here is the code.

 <script type="text/javascript">
 var hammer=new Array("jackhammer0.gif",
                "jackhammer1.gif",
                "jackhammer2.gif",
                "jackhammer3.gif",
                "jackhammer4.gif",
                "jackhammer5.gif",
                "jackhammer6.gif",
                "jackhammer7.gif",
                "jackhammer8.gif",
                "jackhammer9.gif",
                "jackhammer10.gif")
 var curHammer=0;

 var numImg = 11;
 function getHammer() {

   for (i = 0; i < hammer.length; i++)
   {
     if (curHammer < hammer.length - 1) {
       curHammer = curHammer +1;
       hammer[i] = new Image();
       hammer[i].src="poses/jackhammer" +(i+1) + ".gif";

       var nextHammer = curHammer + 1;
       nextHammer=0;
       {
       }
     }
   }
 }


 setTimeout("getHammer()", 5000);

 </script>
</head>
 <body onload = "getHammer()";>
 <img id="jack" name="jack" src = "poses/jackhammer0.gif" width= "100" height ="113" alt =   "Man      and Jackhammer" /><br/>
 <button id="jack" name="jack" onclick="getHammer()">Press button</button>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Following on what Paul, said, here’s an example of what should work:

    var hammer=["jackhammer0.gif","jackhammer1.gif","jackhammer2.gif","jackhammer3.gif",
    "jackhammer4.gif","jackhammer5.gif","jackhammer6.gif","jackhammer7.gif",
    "jackhammer8.gif","jackhammer9.gif","jackhammer10.gif"];

var curHammer=0;

function getHammer() {
    if (curHammer < hammer.length) {
        document.getElementById("jack").src= "poses/" + hammer[curHammer];
        curHammer = curHammer + 1;
    }
}

setTimeout("getHammer()", 5000);

    The big missing element is that you need to call getElementById(“jack”) to get a reference to the DOM Image so that you can change it’s source. If you’re using jQuery or most other JS frameworks, just type $(“#jack”) to accomplish the same.

    • 0