Safari不重画隐藏在剪辑路径中的元素

Question

我遇到了一个奇怪的Safari浏览器错误，它使某些元素在它们悬停之前不可见。

这是由于先前被剪辑（剪辑路径）隐藏的元素引起的。 Safari在悬停效果改变设计后才重新渲染它们，从而迫使Safari浏览器重新绘制对象。

.logo-container { 
    position: absolute; 
    top: 0px; 
    clip: rect(0, auto, auto, 0); 
    clip-path: inset(0, auto, auto, 0); 
} 

Answer 1

为了解决这个问题，我使用了一个重复的css动画来强制safari重绘每秒几次的元素。

@-webkit-keyframes mymove { 
from {top: 0px;} 
to {top: 0.01px;} 
} 

.logo-container { 
    position: absolute; 
    top: 0px; 
    clip: rect(0, auto, auto, 0); 
    clip-path: inset(0, auto, auto, 0); 
    -webkit-animation: mymove 0.1s infinite; /* Safari 4.0 - 8.0 */ 
} 

现在元素被重新绘制并且可见度按预期工作。

如果对这个问题有更好的解决方案，请回答这个问题:)