Ховер кнопки градиентным текстом с trasition?

Question

[Breeze1]

Кто-нибудь знает еще способы, как по ховеру менять текст на градиент с transition, кроме как через &::before и дата атрибут ?

Пример

Answer 1

[Ankhena]

Через кастомные и @property
https://css-tricks.com/property/


https://codepen.io/AnnaSummer/pen/jOJMBzm

Comments

[Breeze1]

Спасибо, проверил, работает везде, кроме firefox, возможно есть какой-от fallback для него ? чтобы красился например просто в обычный цвет на мозилле ?

пример

[Ankhena]

Breeze1, потеряли начальные значения кастомок.
И префиксы стоят от вебкита (ФФ их, конечно, частично понимает, но зачем писать руками префиксы, когда есть автопрефиксер, причем даже на codepen)

Короче, у вас проблема с градиентом, а не с property.
В ФФ всё будет работать кроме анимации, не нужен никакой фолбэк.

[Breeze1]

Ankhena, Можете подсказать, какая проблема с градиентом ? Я если честно, не могу понять где ошибка

[Breeze1]

Ankhena, извините, не сразу увидел ваш пример, спасибо большое

[Ankhena]

Breeze1, а я только что его добавила))