Hey everyone
So basically I am a uni student and have been told to place a stop link to this javascript counter. Because once it starts the gif files continue looping.
This is the file:
<head>
<title>JavaScript Animations</title>
<!-- here we use an external .js file, just like external css but with the .js extension. -->
<script src="animation.js" type="text/javascript">
</script>
</head>
<body >
<h2>Workshop 10 - Example of a JavaScript Animation</h2>
<p><img src="0.gif" name="mypic" border="0" alt="digits" />
</p><p>
<a href="javascript:startShow()">Start Animation</a> <br>
<!--a hint: add one more line here like the one above but calling a Stop script is all you need-->
</p>
</body>
</html>
Can someone please tell me how to make the stop counter link?
We were told it should look similar to this:
<a href="javascript:startShow()">Start Animation</a>
(this was copied from above)
Also, the animation file is made up of several gifs and looks like this:
//animation for first demo
var timerID, num=0;
img0 = new Image (55,45);
img0.src = "0.gif";
img1 = new Image (55,45);
img1.src = "1.gif";
img2 = new Image (55,45);
img2.src = "2.gif";
img3 = new Image (55,45);
img3.src = "3.gif";
img4 = new Image (55,45);
img4.src = "4.gif";
img5 = new Image (55,45);
img5.src = "5.gif";
img6 = new Image (55,45);
img6.src = "6.gif";
img7 = new Image (55,45);
img7.src = "7.gif";
img8 = new Image (55,45);
img8.src = "8.gif";
img9 = new Image (55,45);
img9.src = "9.gif";
function startShow() {
num=num+1;
if(num==10) {
num=0
};
document.mypic.src=eval("img"+num+".src");
timerID=setTimeout("startShow()","1000");
}
function stopShow()
// one line needed here, calling the right JS method
}
Thanks for your help
So basically I am a uni student and have been told to place a stop link to this javascript counter. Because once it starts the gif files continue looping.
This is the file:
<head>
<title>JavaScript Animations</title>
<!-- here we use an external .js file, just like external css but with the .js extension. -->
<script src="animation.js" type="text/javascript">
</script>
</head>
<body >
<h2>Workshop 10 - Example of a JavaScript Animation</h2>
<p><img src="0.gif" name="mypic" border="0" alt="digits" />
</p><p>
<a href="javascript:startShow()">Start Animation</a> <br>
<!--a hint: add one more line here like the one above but calling a Stop script is all you need-->
</p>
</body>
</html>
Can someone please tell me how to make the stop counter link?
We were told it should look similar to this:
<a href="javascript:startShow()">Start Animation</a>
(this was copied from above)
Also, the animation file is made up of several gifs and looks like this:
//animation for first demo
var timerID, num=0;
img0 = new Image (55,45);
img0.src = "0.gif";
img1 = new Image (55,45);
img1.src = "1.gif";
img2 = new Image (55,45);
img2.src = "2.gif";
img3 = new Image (55,45);
img3.src = "3.gif";
img4 = new Image (55,45);
img4.src = "4.gif";
img5 = new Image (55,45);
img5.src = "5.gif";
img6 = new Image (55,45);
img6.src = "6.gif";
img7 = new Image (55,45);
img7.src = "7.gif";
img8 = new Image (55,45);
img8.src = "8.gif";
img9 = new Image (55,45);
img9.src = "9.gif";
function startShow() {
num=num+1;
if(num==10) {
num=0
};
document.mypic.src=eval("img"+num+".src");
timerID=setTimeout("startShow()","1000");
}
function stopShow()
// one line needed here, calling the right JS method
}
Thanks for your help
