Css过渡比例+旋转开启：悬停在IE 10中有一个摇晃的故障

Question

所以，这是演示：

http://jsfiddle.net/9fmSt/7/

在Chrome / FF上完全正常。知道如何解决这个问题吗？

.picCont {
    box-sizing: border-box;
    -moz-box-sizing:border-box;
    width: 320px;
    height: 360px;
    padding: 40px 40px 0px 40px;
    text-align: center;
    background: #FFF;
    position: absolute;
    z-index: 50;
    overflow: hidden;
    -moz-transition-property: all;
    -webkit-transition: all; 
    -moz-transition-duration: 1s;
    transition-duration: 1s;
    -webkit-transition: all 1s ease-in-out; 
    transition: transform all 1s ease-in-out;
    transition: -moz-transform all 1s ease-in-out;
}
.picCont:hover {
    box-shadow: 25px 25px 25px rgba(0,0,0,0.5);
    z-index: 300;
}

js代码用于在jsfiddle中使用rotate + scale悬停。

Answer 1

改进您的代码并从Javascript端删除所有动画内容。了解关键帧动画：http://css-tricks.com/snippets/css/keyframe-animation-syntax/

我认为故障是由此造成的：悬停

.picCont:hover {
    box-shadow: 25px 25px 25px rgba(0,0,0,0.5);
    z-index: 300;
}