Home › Forums › CSS › animate.css is loading double time in firefox and chrome › Reply To: animate.css is loading double time in firefox and chrome
March 23, 2016 at 7:14 am
#239723
Beverleyh
Participant
If you’re only using one animation, why load the whole library? You could just extract the CSS you need (and include a credit to the developer) into your stylesheet.
This will do it;
.my-element { -webkit-animation:fadeInUp 1s both; animation:fadeInUp 1s both }
@-webkit-keyframes fadeInUp {
0% { opacity:0; -webkit-transform:translate3d(0,100%,0) }
100% { opacity:1; -webkit-transform:none }
}
@keyframes fadeInUp {
0% { opacity:0; transform:translate3d(0,100%,0) }
100% { opacity:1; transform:none }
}
Depending on the support you need, you might be able to drop all the vendor prefixes and just use -webkit- too.