HTML5 原生混合模式,html5 – Chrome中的Chrome css3混合混合模式错误

我有两个重叠的叠加层,叠加的部分使用混合混合模式混合.

在chrome中应用了效果但是使用此属性的div有奇怪的闪烁.

这是闪烁的原因以及如何解决.

我已经在firefox上测试了它的良好运行但不是在chrome中.

上面的图像是一旦动画结束,一旦完成,左边的div开始连续闪烁.

{{entry.bottom_banner.banner_heading}}

.bottom-banner .left-overlay

{

mix-blend-mode:multiply;

background:rgba(0,54,108,0.7);

transform:skew(-25deg);

z-index:11;

left:-280px;

}

.bottom-banner .right-overlay

{

width:500px;

transform:skew(-25deg);

right:-600px;

animation:slideinbottom 2s ;

background:red;

mix-blend-mode:multiply;

}