title: HTML - Cannot set property 'src' of undefined
body: <p>This is my code, I am trying to do an animation with 8 pictures, I was thinking first that the error is because the images are .jpg, but i tryed even converting them to .gif format and the code still did not work, When I try to run the code, i get an error saying: "Cannot set property 'src' of undefined", I don't see any mistakes in the code, i tryed looking at it multiple times, please if someone can help, thanks.
      
      
      
              G:\Year 2\OOD - object oriented development\Webpages\Assignment\Explosion
          </p>
  
  <pre><code>    &lt;script&gt;
  
  
      var explosion = new Array(8);
      var c = 0;
      var startExplode;
      var i = 0;
  
  
  
  
          explosion[0] = 'ex1.jpg'
          explosion[1] = "ex2.jpg"
          explosion[2] = "ex3.jpg"
          explosion[3] = "ex4.jpg"
          explosion[4] = "ex5.jpg"
          explosion[5] = "ex6.jpg"
          explosion[6] = "ex7.jpg"
          explosion[7] = "ex8.jpg"
  
  
  
  function explode()
  {   
      if(c == 7 | (i &gt; 0 &amp; i &lt;= 1))
      {
          c = 0;
      }   
      else
      {
          c++;
          document.animation.src = explosion[c];  
      }
  }
  
  
  &lt;/script&gt;
  &lt;body&gt;
  &lt;form&gt;
  &lt;img src ="ex1.jpg" name = "explosion" position = "fixed"&gt;
  
  &lt;input type="button" name="startExplode" value="explode"
      onClick="startExplode=setInterval('explode()',20);"&gt;
  
  &lt;/form&gt;
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>