延迟一个接一个地淡入div

Question

我想做这样的事情

图像应从右侧淡入并缩小为100％然后逐渐淡入右侧，反之亦然

那是我的code

问题是，当第二个//*[@id="fundCardVO"]/div[2]/div[1]/div[1]/div[1]/strong[1]淡出时，它的行为与第一个不同，当它达到转换的75％时，它会超出.spinner

第三个也出现在下一行，我试过.row但它不起作用

有什么帮助吗？

PS：忘记红色按钮，转换也适合一个display:inline

Answer 1

您希望所有元素共享相同的动作。

因此，他们的初始位置必须相同。如果在流中使用元素，则不会发生这种情况。绝对定位他们：

.spinner {
    position: absolute;
    left: 500px;
}

我已经删除了许多不再需要的前缀，并添加了一些z-index更改。这不是完美的，你需要稍微努力......

fiddle