How to animate jpgs using setInterval()
Hello,
My question is about creating an animation using the setInterval function.
I want to load 5 jpgs in the head section. I then want to call them - one second apart - using the setInterval function in the body section.
Below is a simple example of what I'm attempting to do. Can someone please correct my code? Or tell me what I'm doing wrong?
Thanks so much!
HTML Code:
<head>
<script type="text/javascript">
var c = 1;
/* Preloading images */
var image1 = new Image();
image1.src = "a1.jpg";
var image2 = new Image();
image2.src = "a2.jpg";
var image3 = new Image();
image3.src = "a3.jpg";
var image4 = new Image();
image4.src = "a4.jpg";
var image5 = new Image();
image5.src = "a5.jpg";
function disp_img(w)
{
if (c == 6)
{
c = 1;
}
var img_src = "a" + c + ".jpg";
document.ani.src = img_src;
c++;
</script>
</head>
<body>
<script type="text/javascript">
setInterval("disp_img(c)", 1000);
</script>
</body>
