nicht angemeldet
Hallo Marc!
Du musst bei fünf Bildern beispielsweise dafür sorgen, dass 4/5 der Zeit die Bilder nicht zu sehen sind. Und die delays für die Bilder jeweils um 1/5 versetzen,
Es tut mir leid, aber ich verstehe halt leider nicht, wie Dein Script funktioniert. Ich weiß nicht, wie ich dafür sorgen soll, dass bei meinen drei Bilder 2/3 der Zeit die Bilder nicht zu sehen sind. Und wie/wo versetze ich Delays für diese Bilder? Ich habe versucht, mit den verschiedenen Zahlen rumzuspielen, aber ohne Erfolg. Auch mit der Hilfe eines Informatikstudenten wurde ich nicht schlauer. Hier noch mal das Script, wie es bei mir jetzt aussieht:
<style type="text/css">
div { position: relative }
img {
--animation-duration: 5s;
position: absolute;
-webkit-mix-blend-mode: multiply;
mix-blend-mode: multiply;
animation: var(--animation-duration) springenderPunkt infinite;
}
img:nth-of-type(2n)
{
animation-delay: calc(var(--animation-duration)*2/3);
}
@keyframes springenderPunkt
{
0% { opacity: 0 }
20% { opacity: 0 }
40% { opacity: 1 }
60% { opacity: 1 }
80% { opacity: 0 }
100% { opacity: 0 }
}
</style>
</head>
<body>
<div>
<img src="FSP-Eigenschaften1.png">
<img src="FSP-Eigenschaften2.png">
<img src="FSP-Eigenschaften3.png">
</div>
Und hier das Ergebnis: http://www.fotosatzpfeifer.de/html/test_bildwechsel4c.html
marctrix
Gunnar Bittersmann
JürgenB
Auge
Henry
Matthias Apsel