Линейный градиент от SVG не может быть применен в качестве заполнения для одного и того же SVG ⇐ CSS

[Anonymous]

Я попытался воссоздать градиент из этого ответа на переполнение этого стека, но он не сработал; Все, что я получаю,-это цвет резервного цвета. < /p>
На моем реальном веб-сайте я также получил ошибку: < /p>

Неожиданное значение var (-процентб). Вернулся, я также сохранил анимацию, и, похоже, JSTHAT, кажется, это вызывает. class = "Snippet-Code-JS Lang-JS PrettyPrint-Override">

Код: Выделить всё

function reverse(){
document.getElementById('#anim').innerHTML=`

`/*bannerZmiana.background="blue"*/
}< /code>
: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>












k

Подробнее здесь: https://stackoverflow.com/questions/795 ... e-same-svg