Home/ Questions/Q 8729395
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-13T08:49:31+00:00

I am really a beginner at javascript and wanted to create a small image

  • 0

I am really a beginner at javascript and wanted to create a small image slider. I have used setInterval to delay the loading so that it would create a slider effect. But somehow the images are not sliding and I have a hinch that the problem lies in the loop. I have already looked up at some options and am asking here as a last option. Thanks in advance.

<!Doctype html>
  <meta charset="UTF-8">
    <head>

<title>Simple Image Slider</title>
    <script type="text/javascript">
   var counter=0;
    var images=new Array['download.jpg','images (1).jpg','images.jpg'];

       function start(){

    setInterval("slide()",2000);
      }

    function slide(){
    for(counter=0;counter<images.length;counter++)
document.getElementById('mageslide').src=images[counter];
   }
 </script>
<link rel="stylesheet" type="text/css" href="style.css">
     </head>
     <body>
<div id="wrapper">
      <div class="slider" onload="start()">
          <img src="images.jpg" id="mageslide"></img>
       </div>
      **strong text** </div>
      </body>
    </html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Your slide() function is wrong, you’re supposed to iterate one image per interval, not all images in one interval iteration, try this fixed version:

    function slide(){
   window.counter++;
   if (window.counter >= window.images.length) {
      window.counter = 0;
   }
   document.getElementById('mageslide').src=window.images[window.counter];
}
    • 0