Home/ Questions/Q 4273208
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-21T07:40:54+00:00

The cat that is on this web page is suppose to move when you

  • 0

The cat that is on this web page is suppose to move when you click it to move and stop moving when you click it. For some reason mine is not doing it. I do not receive any errors either. Can someone point me in the direction of what I am doing wrong?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Fat Cat Dancing</title>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
<script type= "text/javscript">
<![CDATA[
  var cats = new Array(3);
  var fatCat = 0; 
  var direction; 
  var begin; 
  cats[0] = "fatcat0.gif"; 
  cats[1] = "fatcat1.gif"; 
  cats[2] = "fatcat2.gif";

  function dance() { 
    if (fatCat == 0)     
      direction = "right"; 
    else if (fatCat == 2)          
      direction = "left"
    if (direction == "right")     
      ++fatCat;     
    else if (direction == "left")         
      --fatCat;     
    document.animation.src = cats[fatCat];     
  } 
  function startDancing() {     
    if (begin)         
      clearInterval(begin);     
    begin = setInterval("dance()",200); 
  }
]]>
</script>
</head>
<body>
<h1>Fat Cat Dancing</h1> 
<p><img src="fatcat1.gif" name="animation" alt="animation" id="animation" /></p> 
  <form action=""> 
    <input type="button" name="run" value="Start Dancing" onClick="startDancing();" />
    <input type="button" name="stop" value="Stop Dancing" onClick="clearInterval(begin);" />
  </form>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
 <title>Fat Cat Dancing</title>
 <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
 <script type= "text/javascript">
  <![CDATA[
  var cats = new Array(3);
  var fatCat = 0; 
  var direction; 
  var begin; 
  cats[0] = "fatcat0.gif"; 
  cats[1] = "fatcat1.gif"; 
  cats[2] = "fatcat2.gif";
  function dance() { 
    if (fatCat == 0)     
        direction = "right"; 
   else if (fatCat == 2)          
        direction = "left";
  if (direction == "right")     
        ++fatCat;     
    else if (direction == "left")         
        --fatCat;     
        document.animation.src = cats[fatCat];     
 } 
 function startDancing() {     
  if (begin)         
    clearInterval(begin);     
    begin = setInterval("dance();",200); 
   }
  ]]>
 </script>
 </head>

 <body>


<h1>Fat Cat Dancing</h1> 
<p><img src="fatcat1.gif" name="animation" alt="animation" id="animation"/></p> 
<form action= ""> 
<input type="button" name="run" value="Start Dancing" onClick="startDancing();"/>
<input type="button" name="stop" value="Stop Dancing "   onClick="clearInterval(begin);"/>

    You forgot to delimit a few lines.

    EDIT: Good eye, Zecc! You also spelled “javascript” wrong in your <script> tag.

    • 0