Zdravím, ako spustiť animáciu textu až vtedy, keď scrollnem na daný <div>? Teraz mi animácie celej stránky prebehnú na začiatku, keď sa mi načíta web, no chcem pomocou JQuery zistiť, či som na danom dive a až vtedy spustiť animáciu. Ako to urobiť? Toto je môj terajší kód... Vďaka za pomoc!
Kód:
HTML:
<div class="obsah slideInRight" style="visibility: visible; animation-name: slideInRight;">
tu je obsah, ktorý príde zprava...
</div>
CSS:
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
-webkit-animation: slideInRight 1s ease ;
-moz-animation: slideInRight 1s ease ;
animation: slideInRight 1s ease ;
}
@-webkit-keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes slideInRight {
0% {
opacity: 0;
-webkit-transform: translateX(2000px);
-ms-transform: translateX(2000px);
transform: translateX(2000px);
}
100% {
-webkit-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
}
}