行为描述
在下面的 gif 中,当加载字幕(灰色文本)时,它们似乎仍然具有与加载状态相同的背景动画,即background-color
仍在动画中。单击后,动画消失,字幕按预期呈现(无background-color
动画)。这只发生在 Chrome 中。我无法在 Safari 中重现这一点。
细节
上面 gif 中的一个框的一般 dom 结构如下所示:
<div class="header">
<div class="title modifier">...</div>
<div class="subtitle modifier">...</div>
</div>
根据加载状态,modifier
上面的占位符要么是pt-skeleton
(一个带有这些动画样式的 CSS 类)要么没有。样式的代码在这里。
在显示发光背景和文本时检查字幕时,样式中没有任何内容表明animation
设置了属性。为什么 Chrome 决定暂时保留不再应用于我的元素的类的 CSS 样式?