Css 使用模糊过渡时如何防止图像闪烁？

如何防止在滤镜过渡结束时闪烁：模糊效果？ （我正在使用chrome） 下面的代码片段显示问题

$（窗口）.on（'load'，函数（事件）{
setTimeout（函数（）{
$（'.sec'）.addClass（'活动'）
},1000)
})

.sec{
保证金：0自动；
宽度：700px；
高度：500px；
背景图片：url(http://placekitten.com/700/500);
背景尺寸：封面；
-webkit过滤器：模糊（20px）；
-moz滤波器：模糊（20px）；
-o-滤波器：模糊（20px）；
-ms过滤器：模糊（20px）；
过滤器：模糊（20px）；
}
.秒激活{
-webkit过滤器：模糊（0px）；
-moz滤波器：模糊（0px）；
-o-滤波器：模糊（0px）；
-ms过滤器：模糊（0px）；
过滤器：模糊（0px）；
过渡：所有3s缓解，转换1s缓解；
}

<代码> > P>一个想法是避免<代码>模糊>代码> 0，您可以考虑一个值，如<>代码> 0px 


$（窗口）.on（'load'，函数（事件）{
setTimeout（函数（）{
$（'.sec'）.addClass（'活动'）
}, 1000)
})
.sec{
保证金：0自动；
宽度：700px；
高度：500px；
背景图片：url(http://placekitten.com/700/500);
背景尺寸：封面；
过滤器：模糊（20px）；
}
.秒激活{
过滤器：模糊（0.5px）；
过渡：所有3s缓解，转换1s缓解；
}

该解决方案与给定示例有何不同？@VXp在Chrome中测试，Chrome在filters@TemaniAfif我是，但我看不出有什么不同。：）@你看不到结尾的闪光吗？或者你在他们身上都看到了闪光？或者你根本看不到闪光？@Temaniaf如果根本看不到闪光。我不会说你的解决方案没有解决问题，显然它解决了问题，但我看不出两者在视觉上有什么区别，也许只是我，也许不是。