Как сделать плавный переход линейного градиента в js?
Есть некий блок, у которого есть свойство background: linear-gradient(to top, #bc9155, #d39e54); Как сделать плавный переход на другие цвета, если свойство transition почему-то не работает?
Угу, не работает transition с линейным градиентом.
И JS тут совсершенно не при чем %) Делается небольшим костылем на CSS.
Самое простое, использовать блок с абсолютным позиционированием. https://jsfiddle.net/webirus/0sn1fwet/
Я сделал через псевдоэлемент, так как у меня не заполнен контент.
В случае, если контент есть, просто делайте отдельный див.
Да, есть несколько вариантов. Можно делать через opacity, как вам показали выше.
Можно еще сделать контейнер градиента шире, растянуть, обрезать, а потом двигать. Получается более плавный и красивый эффект: codepen.io/georgehastings/pen/xgwxgo
И еще можно все сделать на canvas сменой кадров.
Простой