Current course:

Javascript time & timing

What can you do with Javascript and time/timing?

Intervals: Timers that continue to run at a set "interval" until stopped manually.

Timeouts: Timers that run once and stop - like a kitchen timer.

Step Through the PNGs

Click the image to go to start the animation. Roll out of the image to stop the animation.

      <script type="text/javascript">
            var myImages = new Array("images/img1.png", "images/img2.png",
                        "images/img3.png", "images/img4.png",
                        "images/img5.png", "images/img6.png",
                        "images/img7.png", "images/img8.png");
            var myInterval = "";
            var currentImg = 0;
            function animate() {
                  setInterval('nextImage()', 100);
            function nextImage() {
                  if (currentImg == myImages.length) {
                        currentImg = 0;
                  document.getElementById('myPNG').src = myImages[currentImg];
      <img id="myPNG" src="../images/img1.png" onclick="animate();">