Rotate Images

[Total: 0    Average: 0/5]

This shows how to have an image rotate through a set of images at a given rate.

Head Code:

<script>
var n=0;
var a=null;
var imgs = new Array();
    imgs[0] = new Image(); imgs[0].src =  "http://www.js-examples.com/js/pic1.gif";
    imgs[1] = new Image(); imgs[1].src =  "http://www.js-examples.com/js/pic2.gif";
    imgs[2] = new Image(); imgs[2].src =  "http://www.js-examples.com/js/pic3.gif";
function rotate(){
  n=(n+1)%3;
  document.p1.src=imgs[n].src;
  if(a==null)a=setInterval("rotate()",300);
}
</SCRIPT>

Body Code:

<img name=p1 width=25 height=25 src="http://www.js-examples.com/js/pic4.gif">
<HR>
Note: Normally you could put this statement into the body onload.<BR>
<a href='javascript:rotate()'>click here to start this going</a>

Times Viewed: 0

Leave a Reply

Your email address will not be published. Required fields are marked *