兩個位置相對落後的div（重疊）

Question

tl; dr：position: relative的第一個div在position: relative之上的第二個div上方。它們必須重疊。

我在自舉中有一個旋轉木馬。我想要改變滑塊效果（從右到左）到平滑過渡不透明度0-1（當第一個div消失時，另一個在同一位置顯示）。

所以要做到這一點，每個div必須具有相同的參數width/height/top/left parametr。 .active項目必須與.active .left和.next .left相同。我的第一個想法是創建某事像這樣：

.active, .carousel-inner>.item.next.left, .carousel-inner>.item.prev.right 

，並給exacly同樣parametrs + position: relative。

這是問題所在。與position: relative第一格是第二格以上position: relative。這使效果平穩過渡不起作用。

Answer 1

問題解決了：

margin-top在第二個div必須正好第一個div的相同像高（例如margin-top: -50%）

Answer 2

如果你希望它是動態的，而不是手動編程在高度/餘量中，給出第一格position: absolute。這將導致其他元素無視它，第二個div將是最重要的。

https://jsfiddle.net/dk9gwnkj/2/