Как сделать анимацию?

Question

[pavlikmd]

Есть такая картинка в PSD, сайт уже сверстан, отдельно карта и эти белые линии(полоски). Нужно сделать так чтобы при загрузке сайта сначала появилась карта а потом эти линии анимировано разъехались по разным сторонам. Как сделать, куда смотреть, может есть какой-то пример или jqury плагин ?

Answer 1

[Nwton]

при загрузке сайта сначала появилась карта

1) window onload запускаем css анимацию opacity 0 > 1 для div с чистой картой

линии анимировано разъехались по разным сторонам

2) Поверх div с чистой картой ставим svg слой с кривыми и их анимацией

Comments

[pavlikmd]

как с анимировать их в svg?я в анимации не мастер

[Nwton]

pavlikmd: codepen.io/chriscoyier/pen/bGyoz вот пример, разбирайтесь :)

[Николай]

pavlikmd: https://youtu.be/PH_YhHsfEIk