Как сначала загрузить svg в кеш браузера а потом загружать саму страницу?

Question

[tripcollor]

Делаю вот этот сайт vadimbashirof.zzz.com.ua
На первом экране анимация с bacgraund там на фоне svg картинка подменяется, в общем 6 картинок переменяют друг друга. Из за этого при первом открытии сайта все мигает, но при повторном обновлении все плавно.

Как сначала загрузить эти картинки в кеш а потом уже загружать всю страницу?

Comments

[Stepanya]

зачем вы используте технологию подмены картинок имея на руках свг?

[tripcollor]

Stepanya: а что вы предлагаете? мне нужно чтобы картинка плавно появлялась с лева на право.

[Stepanya]

tripcollor: оставляете один свг, в нем у вас есть куча "..." на них навесите классы phase-1, phase-2 и тд. в стилях на эти классы animation-delay с opacity выставите

[tripcollor]

Stepanya: получается нужно svg вставить в сам документ html? через bg в css такого не добиться. Это приестся все переверстывать=), ведь там специально сделано через bg cо свойством cover, для резиновости. Проще закешировать

[Stepanya]

tripcollor: можете прямо в свг контейнере в теге style всё прописать

[tripcollor]

Stepanya: напишите свой ответ ниже я выберу решением=)
помучился и всетаки сделал)
vadimbashirof.zzz.com.ua

Answer 1

[tripcollor]

Проблема решена. Сделал svg анимацией. Но если подскажете как закешировать изображения до загрузки страницы не помешает=)