2016-06-07 2 views
0

tl; dr : 첫 번째 div는 position: relative이고 두 번째 div는 position: relative입니다. 그것들은 겹쳐 져야합니다.두 번째 div는 상대적 위치 뒤에 (중복)

부트 스트랩에 회전 목마가 있습니다. 오른쪽에서 왼쪽으로 변경 슬라이더 효과를 사용하여 전환 불투명도 0-1을 부드럽게하고 싶습니다 (첫 번째 div가 사라지고 다른 div가 사라지는 시점).

이렇게하려면 모든 div의 매개 변수는 width/height/top/left이어야합니다. .active 항목은 .active .left.next .left과 같아야합니다.

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

와 exacly 같은 parametrs + position: relative을 제공 : 내 첫번째 생각은이 같은 STH를 만드는 것이 었습니다.

여기에 문제가 있습니다. 첫 번째 div는 position: relative이고 두 번째 div는 position: relative입니다. 이렇게하면 효과가 원활하게 전환되지 않습니다.

overlapping div's with position relative

답변

0

문제 해결 : 두 번째 DIV의

margin-top 정확히 첫번째 사업부의 같은과 같은 높이 여야합니다 수동으로

0

당신이 동적하려면 대신 (예 margin-top: -50%에 대한) 프로그래밍 높이/여백에 첫 번째 div position: absolute을 입력하십시오. 그러면 다른 요소가이를 무시하고 두 번째 div이 바로 위에 위치하게됩니다.

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

관련 문제