Bilder mit einem Setinterval und Switch-Anweisung ändern

Question

Meine Idee ist Bilder dynamisch durch die Zeit ändern, aber nicht funktioniert. Jedes Feld beginnen mit einem anderen Bild.

var dir_img = ['img1.svg','img2.svg','img3.svg']; 

     setInterval(function() { 
     $('.box img').each(function(){ 
      var image = $(this).attr('src').val(); 
      switch(image) { 
       case dir_img[0]: 
        $(this).attr('src',dir_img[1]); 
        $(this).hide().delay(0).fadeIn(0).delay(1000).fadeOut(0); 
        break; 
       case dir_img[1]: 
        $(this).attr('src',dir_img[2]); 
        $(this).hide().delay(0).fadeIn(0).delay(1000).fadeOut(0); 
        break; 
       case dir_img[2]: 
        $(this).attr('src',dir_img[0]); 
        $(this).hide().delay(0).fadeIn(0).delay(1000).fadeOut(0); 
        break; 
       default 
      } 
     }); 
     }, 1000); 

A versucht, get src 2 Möglichkeiten für

var image = $(this).attr('src').val(); 
var image = $(this).attr('src'); 

Die Boxen und img-Tags

<div class="box"> 
    <img src="img1.svg"> 
</div> 
<div class="box"> 
    <img src="img2.svg"> 
</div> 
<div class="box"> 
    <img src="img3.svg"> 
</div> 

Answer 1

Es gibt ein paar Probleme mit dem Code:

• die default Zustand innerhalb Ihrer switch i s nicht geschlossen.
• die Variable este Sie verwenden als Wähler nicht
• $(this).attr('src'); das Richtige ist hier definiert ist, wird das Attribut src keinen Wert haben

Damit Ihr Code funktionieren sollte festgelegt.

Hinweis: Da Sie in jeder switch-Anweisung den gleichen Ausdruck ($(este).hide().delay(0).fadeIn(0).delay(1000).fadeOut(0);) verwenden, könnten Sie das wahrscheinlich auch außerhalb Ihres Schalters tun.

---

Example