Запуск CSS-анимации только после полной загрузки страницы ⇐ CSS
-
Anonymous
Запуск CSS-анимации только после полной загрузки страницы
i need a solution with Wordpress. In my case, i want to CSS Animtations only effect after the page is 100% loaded. An example: text
My HTML
My CSS
@keyframes fade-in-left-to-right { to { opacity: 1; stroke-dashoffset: 0; } } .svg-one { position: absolute; display: flex; flex-direction: column; left: 0; top: 25%; width: 14%; } .svg-one svg { position: absolute; display: block; width: 23vw; height: auto; stroke-dasharray: 1000; stroke-dashoffset: 1000; opacity: 0.5; animation: fade-in-left-to-right 2.5s linear forwards; animation-delay: 1.2s; } .svg-one svg:nth-child(1) { top: 0px; } .svg-one svg:last-child { top: 70px; } Thanks for reading, have a great day!
A function let's animations run only after the website loaded
Источник: https://stackoverflow.com/questions/780 ... -page-load
i need a solution with Wordpress. In my case, i want to CSS Animtations only effect after the page is 100% loaded. An example: text
My HTML
My CSS
@keyframes fade-in-left-to-right { to { opacity: 1; stroke-dashoffset: 0; } } .svg-one { position: absolute; display: flex; flex-direction: column; left: 0; top: 25%; width: 14%; } .svg-one svg { position: absolute; display: block; width: 23vw; height: auto; stroke-dasharray: 1000; stroke-dashoffset: 1000; opacity: 0.5; animation: fade-in-left-to-right 2.5s linear forwards; animation-delay: 1.2s; } .svg-one svg:nth-child(1) { top: 0px; } .svg-one svg:last-child { top: 70px; } Thanks for reading, have a great day!
A function let's animations run only after the website loaded
Источник: https://stackoverflow.com/questions/780 ... -page-load
