zoukankan      html  css  js  c++  java
  • @media (prefers-reduced-motion)

    今天新来的同事,打开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

    喜欢的话,请点赞,转发、收藏、评论,谢谢!
  • 相关阅读:
    成为一个会思考的学习者
    我的第4篇博客
    我的第3篇博客
    第2次作业
    第一次作业:大学,人生的另一个新的开始
    第四次作业
    第三次作业
    第二次作业
    作为大一新生的感悟
    第四次作业
  • 原文地址:https://www.cnblogs.com/johnjackson/p/14592313.html
Copyright © 2011-2022 走看看