如何解决background-blend-mode无法在Safari CSS上使用
我正在开发产品。我闪了闪电。该动画在chrome上效果很好。但是Safari上没有动画。这个问题是由background-blend-mode还是其他原因引起的?
代码:
.block-2 {
-webkit-animation-name: thund;
-webkit-animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
background-blend-mode: normal;
background-image:url(thunder.png),url(red-bg.jpg);
background-position: 99%,100%;
background-repeat: no-repeat;
}
@keyframes thund {
0% { background-blend-mode: normal;
}
100% { background-blend-mode: hue;
}
}
@-webkit-keyframes thund {
0% { background-blend-mode: normal;
;}
100% { background-blend-mode: hue;
}
}
解决方法
这可能是因为您的野生动物园版本。 Safari对background-blend-mode
的支持从版本10.1开始,您可以在caniuse.com中找到它。根据W3学校的说法,background-blend-mode
的动画可能是另一个问题,background-blend-mode
无法制作动画。您可以在此link中找到它,但是对此我不太确定(background-blend-模式无法设置动画)。这是因为我尝试了并且它起作用了。因此问题可能出在Safari版本上。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。