nicht angemeldet
Ich habe jetzt versucht, das Script mit den SVGs auf meinen Fall (erst mal mit zwei Bildern) umzuschreiben. Da stehen dann einfach nur die beiden Bilder untereinander und nichts passiert. Was mache ich falsch?
<style type="text/css">
#template { display: none }
div { position: relative }
svg {
--animation-duration: 5s;
position: absolute;
-webkit-mix-blend-mode: multiply;
mix-blend-mode: multiply;
animation: var(--animation-duration) springenderPunkt infinite;
}
#right
{
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>
<svg id="template"><img src="FSP-Eigenschaften1.png"></svg>
<div>
<svg id="right"><img src="FSP-Eigenschaften2.png"></svg>
</div>
marctrix
Gunnar Bittersmann
JürgenB
Auge
Henry
Matthias Apsel