Hallo Leute, ich habe diesen Code, den ich unten hinzufügen werde. Ich versuche, den gesamten Code in einer Endlosschleife zu durchlaufen, nachdem das letzte Bild (imagetest5) seine Animation beendet hat und wieder von vorne beginnt (imagetest1)
Könnten Sie bitte helfen!!
Code:
@keyframes start-animation {
0 % { Deckkraft: 0; }
10 % { Deckkraft: 1; }
20 % { Deckkraft: 0; }
100 % { Deckkraft: 0; }
}
@Keyframes flackern {
0 %, 100 % { Deckkraft: 1; }
50 % { Deckkraft: 0,3; }
}
.imagetest {
Deckkraft: 0;
Animation: Startanimation 20s unendlich, Flicker 2s unendlich;
}
.imagetest1 {
Deckkraft: 0;
Animation:
Einblenden 0,5 s, Einblenden 1 s unendlich,
flimmern1 1s kubisch-bezier(0,4, 0, 1, 1) 1s unendlich abwechselnd,
verschwinden1 0,5 s kubisch-bezier(0,4, 0, 1, 1) 2 s vorwärts;
}
.imagetest2 {
Deckkraft: 0;
Animation:
Einblenden 0,5 Sekunden, Einblenden 6 Sekunden unendlich,
flicker2 1s kubisch-bezier(0,4, 0, 1, 1) 3s unendlich abwechselnd,
verschwinden2 0,5 s kubisch-bezier(0,4, 0, 1, 1) 4 s vorwärts;
}
.imagetest3 {
Deckkraft: 0;
Animation:
Einblenden 0,5 s, Einblenden 10,5 s unendlich,
Flicker3 1s kubisch-bezier(0,4, 0, 1, 1) 5s unendlich abwechselnd,
verschwinden3 0,5 s kubisch-bezier(0,4, 0, 1, 1) 6 s vorwärts;
}
.imagetest4 {
Deckkraft: 0;
Animation:
Einblenden 0,5 Sekunden, Einblenden 15 Sekunden unendlich,
flimmern4 1s kubisch-bezier(0,4, 0, 1, 1) 7s unendlich abwechselnd,
verschwinden4 0,5 s kubisch-bezier(0,4, 0, 1, 1) 8 s vorwärts;
}
.imagetest5 {
Deckkraft: 0;
Animation:
Einblenden 0,5 Sekunden, Einblenden 17 Sekunden unendlich,
flimmern4 1s kubisch-bezier(0,4, 0, 1, 1) 7s unendlich abwechselnd,
verschwinden4 0,5 s kubisch-bezier(0,4, 0, 1, 1) 8 s vorwärts;
}
@keyframes Einblendung {
0 % { Deckkraft: 0; }
100 % { Deckkraft: 1; }
}
@keyframes flicker1 {
0 % { Deckkraft: 1; }
5 %, 25 %, 50 %, 75 %, 95 %, 100 % { Deckkraft: 0,8; }
10 %, 20 %, 30 %, 40 %, 60 %, 70 %, 80 %, 90 % { Deckkraft: 0,6; }
15 %, 35 %, 55 %, 85 % { Deckkraft: 0,4; }
45 %, 65 %, 88 % { Deckkraft: 0,2; }
}
@keyframes flicker2 {
0 % { Deckkraft: 1; }
5 %, 25 %, 50 %, 75 %, 95 %, 100 % { Deckkraft: 0,8; }
10 %, 20 %, 30 %, 40 %, 60 %, 70 %, 80 %, 90 % { Deckkraft: 0,6; }
15 %, 35 %, 55 %, 85 % { Deckkraft: 0,4; }
45 %, 65 %, 88 % { Deckkraft: 0,2; }
}
@keyframes flicker3 {
0 % { Deckkraft: 1; }
5 %, 25 %, 50 %, 75 %, 95 %, 100 % { Deckkraft: 0,8; }
10 %, 20 %, 30 %, 40 %, 60 %, 70 %, 80 %, 90 % { Deckkraft: 0,6; }
15 %, 35 %, 55 %, 85 % { Deckkraft: 0,4; }
45 %, 65 %, 88 % { Deckkraft: 0,2; }
}
@keyframes flicker4 {
0 % { Deckkraft: 1; }
5 %, 25 %, 50 %, 75 %, 95 %, 100 % { Deckkraft: 0,8; }
10 %, 20 %, 30 %, 40 %, 60 %, 70 %, 80 %, 90 % { Deckkraft: 0,6; }
15 %, 35 %, 55 %, 85 % { Deckkraft: 0,4; }
45 %, 65 %, 88 % { Deckkraft: 0,2; }
}
@keyframes verschwinden1 {
0 % { Deckkraft: 1; }
100 % { Deckkraft: 0; }
}
@keyframes verschwinden2 {
0 % { Deckkraft: 1; }
100 % { Deckkraft: 0; }
}
@keyframes verschwinden3 {
0 % { Deckkraft: 1; }
100 % { Deckkraft: 0; }
}
@keyframes verschwinden4 {
0 % { Deckkraft: 1; }
100 % { Deckkraft: 0; }
}
Das obige ist der detaillierte Inhalt vonIch möchte diesen gesamten Code in einer Endlosschleife durchlaufen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!