изменение изображения по таймеру,

Я знаю, что этот вопрос задается часто, но я не могу скопировать код. Я хочу, чтобы изображение менялось через какое-то время. Я думаю, что я сделал много неправильных ошибок кодирования. ниже мой код.изменение изображения по таймеру,

заранее спасибо за помощь,

Jasper

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>test</title> 
     <link rel="stylesheet" type="text/css" href="/css/styles.css"> 
    </head> 
     <body> 

     <img id="image" src="foto1.jpg"> 







      <script type = "text/javascript"> 

       var image=document.getElementById("image"); 
       function volgendefoto() { 

       if (images==0){ 
        image.src="foto2"; 

       } 

        if (images==1){ 
         image.src="foto2"; 

        } 
         if (images==3){ 
          image.src="foto1"; 

         } 
      } 

      function timer(){ 

       setInterval(volgendefoto, 3000); 
          } 

      var images= [], x = -1; 
       image[0]="foto1.jpg"; 
       image[1]="foto2.jpg"; 
       image[2]="foto3.jpg"; 



      </script> 
     </body> 
    </html>

источник

2016-12-02 Jasper Scheper

«не может скопировать код»? звучит как школьное задание. назад в мои дни мы знали, как копировать и изменять имена переменных;) – xShirase

да, это для школы. это слишком очевидно, если я его скопирую, они знают мое поведение в кодировке и распространенные ошибки :) –

@xShirase, haha ikr –

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <title>test</title> 
     <link rel="stylesheet" type="text/css" href="/css/styles.css"> 
    </head> 
     <body> 

     <img id="image" src="foto1.jpg"> 





     <script type = "text/javascript"> 

      var image=document.getElementById("image"); 
      var currentPos = 0; 
      var images = ["foto1.jpg","foto2.jpg","foto3.jpg"] 

      function volgendefoto() { 
       if (++currentPos >= images.length) currentPos = 0; 
       image.src = images[currentPos]; 
      } 

      setInterval(volgendefoto, 3000); 

     </script> 





     </body> 
    </html>

источник

2016-12-02 10:18:41 ixpl0

благодарит за ваш быстрый ответ! оно работает! –

отметьте его как «правильный ответ» :) – ixpl0

да, я сделал, мне пришлось подождать еще 3 минуты –

Вы не создаете свой интервал, таймер никогда не выполняется. Вот один, который будет цикл ваших фотографий, при условии, что ваш первый образ изображения является один предустановленными (например: images[0] === image.src на странице загрузки):

const image=document.getElementById("image"); 
    let images= ["foto1.jpg","foto2.jpg","foto3.jpg"], i = 0; 

    function volgendefoto() { 
     i<images.length?i+=1:i=0; 
     image.src=images[i]; 
    } 
    setInterval(volgendefoto, 3000);

источник

2016-12-02 10:17:51 xShirase

благодарит за ваш быстрый ответ! Я уже принял ответ выше, потому что я могу понять этот ответ! ваш код немного сложнее для меня на данный момент. –

const и let являются объявлениями ES6, ваши учителя должны заставить вас использовать их: p и тернарное выражение, это просто a if. – xShirase

Я спрошу его об этом! благодаря! –

изменение изображения по таймеру,

ответ

Смежные вопросы