首页 > 其他 > 详细

@media (prefers-reduced-motion)

时间:2021-03-29 15:33:48      阅读:26      评论:0      收藏:0      [点我收藏+]

今天新来的同事,打开Doclever系统(web)时,一直加载,后来发现页面中的#SBDocStartLoading这个div元素遮罩在页面上方,中html/dist/vender.bundle.js中查到代码发现元素上加了animated fadeOut两个class(实现淡出动画), 后面用once绑定了一个事件,当动画结束时移动这个div元素。

代码加断点发现once绑定的处理函数没有触发。

反了一下fadeOut的样式文件,发现它用关键帧动画实现了opacity的修改达到淡出效果。

但在同事的机器上没效果,最后发现它的动画css 被 @media (prefers-reduced-motion)这个下的规则unset掉了。

最后在网上查了一下,windows下要在设置中打开动画效果才行。

参考: https://blog.csdn.net/u010176097/article/details/114408253

@media (prefers-reduced-motion)

原文:https://www.cnblogs.com/johnjackson/p/14592313.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!