찾다

 >  Q&A  >  본문

css3 - safari页面的一出设置了css动画,影响页面其他地方文字的font-weight

正常状态

动画状态

最后动画执行完又变回正常状态

 animation-duration: 3s;
    animation-name:listAnimation;
    animation-fill-mode: both;
    -webkit-animation-duration: 3s;
    -webkit-animation-name:listAnimation;
    -webkit-animation-fill-mode: both;
    -moz-animation-duration: 3s;
    -moz-animation-name:listAnimation;
    -moz-animation-fill-mode: both;
    -o-animation-duration: 3s;-o-animation-name:listAnimation;-o-animation-fill-mode: both;
    animation-fill-mode: both;
@-webkit-keyframes listAnimation {
    0% {
        -webkit-transform: perspective(400px) rotateY(90deg);
        -moz-transform: perspective(400px) rotateY(90deg);
        -o-transform: perspective(400px) rotateY(90deg);
        transform: perspective(400px) rotateY(90deg);
        filter:alpha(opacity=0);
        -moz-opacity:0;
        opacity:0;
    }

    40% {
        -webkit-transform: perspective(400px) rotateY(-10deg);
        -moz-transform: perspective(400px) rotateY(-10deg);
        -o-transform: perspective(400px) rotateY(-10deg);
        transform: perspective(400px) rotateY(-10deg)
    }

    70% {
        -webkit-transform: perspective(400px) rotateY(10deg);
        -o-transform: perspective(400px) rotateY(10deg);
        -moz-transform: perspective(400px) rotateY(10deg);
        transform: perspective(400px) rotateY(10deg)
    }

    100% {
        -webkit-transform: perspective(400px) rotateY(0deg);
        -moz-transform: perspective(400px) rotateY(0deg);
        -o-transform: perspective(400px) rotateY(0deg);
        transform: perspective(400px) rotateY(0deg);
        filter:alpha(opacity=100);
        -moz-opacity:1;
        opacity:1;
    }
}
迷茫迷茫2782일 전601

모든 응답(1)나는 대답할 것이다

  • 大家讲道理

    大家讲道理2017-04-17 11:24:35

    https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_animated_properties
    试过强制在keyframe里指定font-weight吗?

    회신하다
    0
  • 취소회신하다