CSS背景图片转换＆＃34;震动＆＃34;过渡时

Question

我有一个图像横幅，通过使用jQuery来更新background-image属性来旋转图像。当两个图像之间的转换时，新图像将“抖动”＃34;直到过渡完成。横幅的CSS如下：

div#reviewPanel {
    width: calc(100% + 100px);
    background: no-repeat center;
    -moz-background-size: cover;
    -webkit-background-size: cover;
    background-size: cover;
    text-align: center;
    padding: 0;
    margin: 0 -50px;
    position: relative;
    -webkit-transition: background-image 2s ease-in-out;
    transition: background-image 2s ease-in-out;
    background-color: #1f292d;
    max-height: 600px;
}

横幅的高度是根据屏幕尺寸动态设置的，但是在应用背景图像之前设置，如果我设置了固定高度，则问题仍然存在。

你可以在这里看到一个例子： https://jsfiddle.net/jbuckland/rs5eqhaj/

我已在Mac上的Chrome和Safari中测试过，我不确定其他浏览器/操作系统中是否存在这种行为。

我知道这是一个相对较新的CSS功能，因此我不确定它是否只是一个错误，但任何帮助都会非常感激。