JavaScript Animation Problem (Fat cats dancing) [closed]
It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center.
Closed 11 years ago.
I am not sure why my cats are not moving at all. I am pretty sure they are suppose too. Can someone point me into if they are suppose to and or what I did wrong thanks.
<!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)
开发者_Go百科 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>
Try:
document.getElementById('animation').src = cats[fatCat];
Your code was assuming that the element would be available by name as a property of "document", but it won't.
Also, as another answer suggests, your "setInterval()" call can be just:
begin = setInterval(dance, 200);
Take out the quotes in the setInterval("dance()",200); line and see if it works.
加载中,请稍侯......
精彩评论