Css3 Transition Blur闪烁的边缘

Question

我试图添加一个效果，如果你单击一个按钮就会模糊背景，但最初的问题是由于某种原因出现白色的边缘，所以我通过使用负边距推出它们，但是当我试图为模糊设置动画并且边缘似乎回来时，当动画完成时会消失，从而导致闪烁效果？

Jsfiddle：https://jsfiddle.net/xq2ohL4x/

$(function(){
    $("#clickme").click(function(){
        setTimeout(function(){
        $(".image").css("-webkit-filter", "blur(18px)");
    },1000); 
    });
});  

有什么想法吗？

谢谢你提前：）

Answer 1

看看这是否适合您。将转换更改为此。

transition: 2s -webkit-filter linear;