IE11 won't show animations. Here is a CSS work around.

[donnagal]

IE 11 doesn't seem to work... A quick workaround fix is to set 'opacity' to 1 for IE.

[bfan1256]

This should be submitted as a pull request instead of an issue. But great work around!

[ivanlytvynov]

Looks like something very similar with Safari 9-

[rehamwael]

this worked with me

Thanks

[michalsnik]

Guys, can you confirm whether this is still an issue on IE? I tried both 2.3.2 and 3.0.0-beta-3 and both versions seems to work fine on IE11.

[mdominguez]

Still experiencing this on 2.3.3 and IE11. Works fine on 2.1.1 (in an older project, switching back to that version now)

[bengcooper]

I've just ran into this issue with IE11 and 3.0.0-beta.4

[aleklisefski]

I'm having the same issue with 3.0.0-beta.6 and also an older version, 2x, unsure exactly. Does not yet seem to be resolved. Any help?

[aharish]

I'm having this issue on 2.3.1 and IE11. Will see if adding the CSS workaround will fix this issue.

Edit: Added the workaround in, and the elements now show, but still don't animate.

[kaspar-allenbach]

That doesn't work. Is there a possibility to disable aos on ie entirely?

[aharish]

Hi @kaspar-allenbach, can you check if you have any other JS errors in IE11 in the console? AOS might be loaded after other scripts, and if there are errors in the other scripts, IE11 might not actually be executing AOS methods at all.

[Kellen-Stuart]

I can verify this is still an issue; using the CDN <script src="https://unpkg.com/aos@next/dist/aos.js"></script>. Animations appear transparent

[Kellen-Stuart]

IE 11 doesn't seem to work... A quick workaround fix is to set 'opacity' to 1 for IE.

I can't get this to work. Is there something special I need?

[michaelmano]

@Kellen-Stuart You may have a few Javascript issues, check your console. if so you will require a few javascript polyfills. one for classlist and one for the array prototype find

[lindsayweb]

Also experiencing this with IE11 using the latest dist. No errors in the console.

[HongPong]

The problem with ie11 seems to be in aos/src/js/helpers/detector.js . it stops the page renders cold. even if i have a polyfill loaded above the aos include statement. hmmm

oh IE11 does not like class statements at all, and detector has a class statement. that would do it. have to finagle something with webpack in the parent project :(

https://stackoverflow.com/questions/37194202/ie11-gives-script1002-error-when-defining-class-in-javascript

[HongPong]

Trying to find a workaround with a wordpress theme and transpiler or polyfill. here was told. ( https://discourse.roots.io/t/adjust-webpack-to-transpile-class-js-statements-for-ie11/16838 )

Classes are an ES6 language feature and cannot be polyfilled. If you need them in an environment that doesn’t support ES6 (for instance, IE11) then you’ll need to transpile them. Babel can do this for you. babel-preset-env is one way to do that: https://babeljs.io/docs/en/babel-preset-env

they also suggested babeljs on stack overflow . https://stackoverflow.com/questions/tagged/babeljs

[HongPong]

i resolved my issue by including aos/dist/aos.js instead of the src version and that was sufficient in my case. thanks transpiler in there....

[lindsayweb]

I have this problem as well. I use the latest AOS from the CDN. I tried a few of the workarounds here and fixed the opacity issue with the original poster's workaround, but just noticed that all of the links on the site were broken on IE11. When I removed AOS, the links worked. So if you've used that hack, double check that your links are working.

[lindsayweb]

This may be relevant -- the problem for me is only happening on my sites that use AOS and Bootstrap 4. The sites that use Bootstrap 3 still work on IE11.

EDIT -- nevermind, I think it was a false equivalency -- all my sites on Bootstrap 3 are still using AOS v 2.3.4. I just tried v2.3.4 on Bootstrap 4 and it works there. So I'm just rolling back to 2.3.4 on all my sites to fix the issue.