Open skwebs opened 4 years ago
Did you find a solution?
You could use this in your main scss file. The key is changing transition-delay to animation-delay. I presume animate.css changed transition's to animation's
[data-aos] {
visibility: hidden;
}
[data-aos].animated {
visibility: visible;
pointer-events: auto;
}
[data-aos] {
@for $i from 1 through 60 {
body[data-aos-delay='#{$i * 50}'] &,
&[data-aos][data-aos-delay='#{$i * 50}'] {
animation-delay: #{$i * 50}ms;
&.aos-animate {
animation-delay: #{$i * 50}ms;
}
}
}
}
It seems there is the same trouble with transition-duration instead of animation-duration
[data-aos] {
@for $i from 1 through 60 {
body[data-aos-duration='#{$i * 50}'] &,
&[data-aos][data-aos-duration='#{$i * 50}'] {
animation-duration: #{$i * 50}ms;
}
}
}
I guess this issue could be handle by the library.
This is:
Specifications
Expected Behavior
I want to add animation delay with "data-aos-delay" but it not working when I using animate.css while working it fine with default animation (aos.css). And another problem is all zoom related animate.css animation appearing and immediately disappeared while with wow.js it working properly.
Actual Behavior
When I using animate.css with aos.js then data-aos-delay does not work. While with default animation aos.css working it fine. I want aos.js work fine as like wow.js especially with zoom related animate.css animations. I want to use aos.js instead wow.js because wow.js does not support reanimation while aos.js support it but it has some problems with animate.css. So please improve it.
Steps to Reproduce the Problem
I created a codepen on this problem.
Detailed Description
Codepen links below: AOS with Animate.css not working "data-aos-delay".
AOS default working fine "data-aos-delay" with aos.css.
Possible Solution