Safari 不重绘被剪辑路径隐藏的元素
Safari not redrawing elements hidden by clip-path
我遇到了一个奇怪的 safari 错误,它使某些元素在悬停之前不可见。
这是由于元素之前被 clip (clip-path) 隐藏了。 Safari 只在悬停效果改变了它们的设计后才重新绘制它们,从而迫使 safari 重新绘制对象。
.logo-container {
position: absolute;
top: 0px;
clip: rect(0, auto, auto, 0);
clip-path: inset(0, auto, auto, 0);
}
为了解决这个问题,我使用了一个重复的 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 */
}
现在元素已重新绘制并且可见性正常工作。
如果有更好的解决方法,请回答这个问题:)
我遇到了一个奇怪的 safari 错误,它使某些元素在悬停之前不可见。
这是由于元素之前被 clip (clip-path) 隐藏了。 Safari 只在悬停效果改变了它们的设计后才重新绘制它们,从而迫使 safari 重新绘制对象。
.logo-container {
position: absolute;
top: 0px;
clip: rect(0, auto, auto, 0);
clip-path: inset(0, auto, auto, 0);
}
为了解决这个问题,我使用了一个重复的 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 */
}
现在元素已重新绘制并且可见性正常工作。
如果有更好的解决方法,请回答这个问题:)