@Wemos

Анимация градиентов?

Здравствуйте!
Ситуация такова - на странице нужно сделать несколько элементов с переливающимся градиентом на заднем фоне. Однако у всех цвета во время перелива должны быть разными. Для исполнения первого элемента использовал этот код:
.circle {
  max-width: 150px;
  border-radius: 50%;
  height: 150px;
}
.pure {
  background: #ffa8fc;
  animation: background 5.5s infinite alternate;
}
@keyframes background {
  50% {
    background: skyblue;
    box-shadow: 0 -200px 100px -100px #4df92a inset;
  }
}

.circle - это сам элемент
.pure - задаю исходный цвет (пусть у всех он должен быть одинаковым)
@keyframes background - анимация

Какой код нужно написать, чтобы у всех элементов цвета во время перелива были разными?
  • Вопрос задан
  • 96 просмотров
Решения вопроса 1
dimovich85
@dimovich85
HTML, CSS, JS, VUE, PHP
JS код надо написать, желательно в canvas, чтоб тормозов было меньше.
https://m.youtube.com/watch?v=CakNmQEmf1I Тут есть про работу с канвасом, посмотрите на этом канале, в плейлисте, может что-то еще найдете, в общем смотрите в этом направлении.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через TM ID
Похожие вопросы
Reklama Guru Санкт-Петербург
от 50 000 до 60 000 руб.
Blogman Оренбург
от 20 000 до 60 000 руб.
Sveak Барнаул
от 40 000 руб.
18 авг. 2018, в 01:10
17000 руб./за проект
17 авг. 2018, в 23:00
5500 руб./за проект