javascript - Different intervals between images -
i studying gcse computing , need able change interval between different images. code @ moment looks this...
<!doctype html> <html> <body> <h1> traffic lights can change on own </h1> <img src="red.jpg" id= "traffic" width="155" height="198"> <script> var myimage = document.getelementbyid("traffic"); var imagearray = ["red.jpg", "red-orange.jpg", "green.jpg", "orange.jpg"]; var imageindex = 0; function changeimage() { myimage.setattribute("src",imagearray[imageindex]); imageindex++; if (imageindex >= imagearray.length) { imageindex = 0; } } setinterval(changeimage,1000); </script> </body> </html>+
if include of code whilst changing intervals ideal.
supposing want solve using javascript only:
// save var timeoutid = window.settimeout(code, [delay]); var imagetimers = [500, 1000, 2000, 4000]; var timetochange = math.random() * 3000; // or whatever want use... var atimer = settimeout(changeimage, timetochange); // on changeimage, alter timetochange var. function changeimage() { // ...stuffs... cleartimeout(atimer); timetochange = imagetimers[imageindex]; atimer = settimeout(changeimage, timetochange); }
Comments
Post a Comment