引导程序禁用了动画,因为使用了“ preferred-reduced-motion”:“ reduce”

时间:2019-07-07 22:57:10

标签: css bootstrap-4 bootstrap-modal

我注意到引导模态动画在打开或关闭时不制作任何动画,检查引导CSS文件后,我发现prefers-reduced-motion: reduce出现的问题我不需要我的网站来支持此媒体

我该怎么做才能使动画再次回到我的网站?

该问题发生在FireFox中,而不发生在Google Chrome中!!

4 个答案:

答案 0 :(得分:2)

在用户不看动画的状态偏好下,这正是Bootstrap 的工作方式。

覆盖此行为将偏离用户的期望和期望,并且不合适。

这是一个可访问性问题。对于患有严重晕车,眩晕或其他一些身体或认知问题的人,动画可能会真正使人迷失方向。

换句话说,不管你想要什么。不要尝试“修复”此问题。

答案 1 :(得分:2)

如果您使用sass编译文件,则可以将$ enable-prefers-reduced-motion-media-query设置为false(默认为true)以停止行为。

答案 2 :(得分:1)

要将动画返回到您的站点,请将this link中的代码添加到您的项目中

这将强制Bootstrap转换再次起作用。

答案 3 :(得分:0)

Mozilla具有published a list在某些条件下会触发此行为的原因

在我的情况下,这是使用Firefox,Windows 10和关闭 Easy Access> Show Animations 的组合。将其重新打开即可解决Bootstrap Modals褪色的问题