상단 div가 제거되었을 때 전환을 만드는 방법

Question

상위 DIV가 제거 될 때 한 div의 전환을 만드는 방법을 알고 싶습니다 ... 그것에 대해 많은 질문이 있지만 모두 Jquery를 사용하고 있습니다. 나는 그것을 사용하고 싶지 않다. 내가 어떻게 할 수 있니? 위 아이가 DOM의 제거

<div class='father'> 
    <div class='child'> 
    <div class='child'> 
    <div class='child'> 
    <div class='child'> 
<div> 

, 다른 div의 최대 전환이 ... 그것이 가능 : 예를 들어

?

Answer 1

.child 클래스에 transition을 추가하는 것만 큼 간단해야합니다. 상위 div를 제거하는 방법에 따라 다릅니다. 여기 예를 들어

.child { 
 
    height: 200px; 
 
    background: #666; 
 
    border: 1px solid; 
 
    transition: 1s; 
 
} 
 
#top:hover { 
 
    height: 0; 
 
} 
 
#next { 
 
    transition: 1s; 
 
}

<div> 
 
    <div class="child" id="top">hover over this div to hide it</div> 
 
    <div class="child" id="next">this div will move up</div> 
 
</div>

입니다