Добрый день,
При помощи любой из SVG библиотек + jQuery необходимо написать скрипт по созданию простого анимационного сценария взаимодействия 4-х элементов (двух микросхем, однойго телефона и облака). (см. приложение 1. Красным цветом отмечены комментарии к элементам).
Данный сценарий должен состоять из шагов (две кнопки внизу окна "Назад" и "Вперед"), каждый из которых либо "подсвечивает" элемент, либо запускает/останавливает анимацию.
Итак, последовательнось шагов (при клике на кнопку "Вперед" осуществляется переход на шаг вперед):
1. Все элементы находятся в статике (т.е. не двигаются), серые, почти не видны (opacity: 0.2). Пунктирных линий (на рисунке обозначены номерами 2, 4, 6) не видно вообще.
2. Подсвечивается облако (7). Opacity: 1. Остальные элементы остаются как были
3. Меняется цвет первой микросхемы (на рисунке номер 1) на зеленый (т.е. она включилась).
4. Микросхема 1 трясется (shake effect) несколько секунд.
5. Подсвечивается вторая микросхема зеленым (на рисунке 2)
6. Между первой и второй микросхемой появляется пунктирная линия (2), которая движется по кругу, как бы обозначая передачу данных.
7. Цвет первой микросхемы меняется на красный и пунктирная линия скрывается.
8. Подсвечивается телефон (5) зеленым цветом и появляется бегущая пунктирная линия 4.
9. Подсвечивается бегущая пунктирная линия 6, а бегущая линия номер 4, просто останавливается.
Размер svg иконок 64px x 64px. Расположение сценария по середине старницы, и вертикально и горизонтально (SVG область не более 400px на 400px).
Оплата по PayPal.
Сроки до 22.12
Опубликован 20.12.2018 в 06:02 Последнее изменение: 20.12.2018 в 06:30
Заказ находится в архиве