在css转换期间,图像border-radius不起作用

我正在使用border-radius：50％;制作图像.默认情况下,图像模糊和缩放(带有隐藏的溢出),并且在悬停时它将删除模糊和缩放.但是,当我在元素上使用CSS转换时,它会在转换期间暂时显示溢出.

http://jsfiddle.net/jonny_me/cyvL61qx

解决方法

我相信转换,元素从文档流中取出,类似阴影位置：相对;并在动画完成后重新放入.

如果强制父级的z-index高于子级的z-index,则父级应继续剪切溢出.

http://jsfiddle.net/cyvL61qx/4/

figure.effect-park {
    background-color: #0D4C16;
    border-radius: 50%;
    z-index: 1;
}

figure.effect-park img {
    z-index: 0;
    opacity: 0.5;
    -webkit-filter: blur(1.5px);
    filter: blur(1.5px);
    -webkit-transform: scale(1.15);
    transform: scale(1.15);
    -webkit-transition: opacity 0.2s,-webkit-transform 0.2s;
    transition: opacity 0.2s,transform 0.2s;
}