-webkit-mask-image使用透明渐变使chrome 49崩溃

时间:2017-05-03 15:19:44

标签: css css3 google-chrome

我想将透明渐变应用于组件。实际上它有效。

但是当我在这个元素中为一个元素设置动画时,它会使chrome49崩溃。 它适用于我的MacBook上的chrome57,但我需要在嵌入式系统上使用chrome49。

这是渐变定义:

.zapband {
    -webkit-mask-image: -webkit-linear-gradient(
        left,
        rgba(255, 255, 255, 0) 16%,
        rgba(255, 255, 255, 1) 40%,
        rgba(255, 255, 255, 1) 60%,
        rgba(255, 255, 255, 0) 84%
    );
}

没有渐变的动画:

.focus-anime, .focus-anime1 {
    animation: 200ms linear focusBlink;
    animation-fill-mode: forwards;
    animation-iteration-count: 1; 
}
.focus-anime1 {
    animation-name: focusBlink1;
}

@keyframes focusBlink {
    from { opacity: 0.4; }
    to   { opacity: 1; }
}
@keyframes focusBlink1 {
    from { opacity: 0.4; }
    to   { opacity: 1; }
}

可能是chrome49无法处理这两个声明吗?或者这可能是一个记忆问题?

0 个答案:

没有答案