Как залить svg изображение?

Question

[siza]

Можно ли сделать постепенную заливку svg изображения как на картинке?



svg изображение -> https://jsfiddle.net/msg46jkn/

Comments

[RAX7]

https://stackoverflow.com/questions/41653467/anima...

Answer 1

[lagudal]

Единственное, там какжый первый(нечетный) path стопа, второй - пятка, поэтому вначале получается что заливается второй, а после него первый.
Лучше объединить каждые два в один составной, тогда можно будет чуть увеличить / поиграться animation-delay между шагами, лучше получится.

Comments

[lagudal]

изменил чуть цикл, чтобы шаги заливались последовательно попарно - теперь пятка и носок заливаются одновременно, и нормально выглядит на маленькой скорости (можно посмотреть, увеличив значение animation-delay).