Animations missing on iPhone/iOS since Bootstrap version 4.1

[JulianZ98]

Since Bootstrap version 4.1 the animations are missing on my iPhone. I tested it on multiple devices with iOS (latest version, iOS 12) and different browsers (Safari and Chrome), but the animations are missing. Because of this, any modal opens without a fade effect (even though it has the "fade" class), the hamburger menu opens without a slide down effect and so on.

This happens not only on my websites, but also on all of the official examples like https://getbootstrap.com/docs/4.1/examples/carousel/ and when I change the CSS file back to version 4.0 (just CSS, not the JS file), everything works fine like it did before. In accordance with this, the v4.0 examples (e.g. https://getbootstrap.com/docs/4.0/examples/carousel/) are also working fine with all the animations on my iPhones. Only since v4.1 I encountered this problem with missing animations.

On my PC (Windows 10) all the animations are working fine when using the latest version 4.1.3, even when I resize the Chrome or Firefox window just like an iPhones screen size. Is this a known issue and is this an iOS problem? Unfortunately, I have no Android smartphones for a comparison.

[mdo]

This is because when reduce motion is enabled on the OS, animations are disabled.

[JulianZ98]

This is because when reduce motion is enabled on the OS, animations are disabled.

Oh, thank you for the fast reply, that was indeed the "problem". I've enabled reduce motion for years now and I already forgot that there is an "prefers-reduced-motion" media query which respects this setting too. Now I saw that this "prefers-reduced-motion" media query was added to bootstrap in version 4.1 (#25641), that explains a lot, thanks.

I think I'll remove the "prefers-reduced-motion" lines from the CSS file or overwrite them, because I don't want to disable reduce motion on my devices because of this.