Question

由于某些奇怪的原因，-webkit-animation-fill-mode: forwards;无法在safari中工作。我不确定为什么，因为它适用于所有其他浏览器。这是代码：

.fade {
        opacity: 0;
       -webkit-animation: fadein 2s;
       -moz-animation:fadein 2s;
       -ms-animation: fadein 2s;

        -webkit-animation-duration: 2s;
        -moz-animation-duration: 2s;
        -ms-animation-duration: 2s;

        -webkit-animation-delay: .9s;
        -moz-animation-delay: .9s;
        -ms-animation-delay: .9s;

        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        -moz-animation-fill-mode: forwards;
        -ms-animation-fill-mode: forwards;
}


@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

您可以看到发生这种情况的网站是http://uiuxpert.com

任何想法是怎么回事？一切看起来都对我不错。

Answer 1

一切都是对的。我只需要清除缓存并进行硬刷新。出于某种原因，今天花了一段时间......互联网。：）

CSS＆＃34;填充模式：转发＆＃34;不在Safari

1 个答案: