Matthias Scharwies: CSS-Animation transform:scale()

Beitrag lesen

Servus!

Ich verzweifel grad: Bildwechsler

Ich will die Bilder nach hinten verschwinden lassen. Damit nach dem dritten Bild kein leerer Hintergrund zu sehen ist, ist das erste als 4. nochmal vorhanden. Der erste Durchlauf funktioniert, danach wird es immer chaotischer. Habt ihr eine Idee, warum es nicht funktioniert oder einen Verbesserungsvorschlag?

@keyframes wechseln {
    0% {opacity: 1; transform:scale(1,1);}
   25% {opacity: 1; transform:scale(1,1);}
   40% {opacity: 0; transform:scale(0,0);}
  100% {opacity: 0; transform:scale(0,0);}
}

#buehne figure:nth-of-type(4) {
  animation: wechseln 15s infinite;	
}

#buehne figure:nth-of-type(3) {
  animation: wechseln 15s infinite;	
  animation-delay: 5s;
}
#buehne figure:nth-of-type(2) {
  animation: wechseln 15s infinite;	
  animation-delay: 10s;
}

Vielen Dank im Voraus!

Matthias Scharwies