Linearer Gradient aus einem SVG kann nicht als Füllung für dasselbe SVG angewendet werden ⇐ CSS

[Anonymous]

Ich habe versucht, https://stackoverflow.com/a/55269126/27557927 zu erstellen, aber es hat nicht funktioniert. Hier. < /p>
Für den Fall, dass der Fehler zurück ist, habe ich auch die Animation und die JS, die es zu verursachen, zu verursachen.

Code: Select all

k

< /code>
CSS < /p>
:root {
--percentA: 0%;
--percentC: 100%;
--colorA: red;
--colorB: pink;
--colorC: orange;
}
.bannerPath{
fill: url(#anim) #f00;
}
/* Only needed if the error above is also the case here */
@property --percentB {
syntax: "";
initial-value: 50;
inherits: false;
}
.anim {
animation-name: fade;
animation-iteration-count: infinite;
animation-duration: 4s;
animation-timing-function: linear;
}
@keyframes fade {
0% {--percentB: 0.01;}
99.99% {--percentB: 99.99;}
100% {--percentB: 0.01;}
}
< /code>
js (wie ich bereits sagte, nur wenn dieses [url=viewtopic.php?t=15738]Problem[/url] auftritt) < /p>
function reverse(){
document.getElementById('#anim').innerHTML=`

`/*bannerZmiana.background="blue"*/
}