왜이 CSS 전환이 작동하지 않습니까?

Question

나는 전환을 요소에 코드를 가지고 :

는

#zlatest .zreader-toggle-fetch-inner { 
    -webkit-transition: all 3s ease-in-out; 
    -moz-transition: all 3s ease-in-out; 
    -o-transition: all 3s ease-in-out; 
    transition: all 3s ease-in-out; 
} 

이 하나의 요소와 일치합니다. 이 요소에서 이러한 클래스간에 전환하고 원활한 전환을 원했지만 변경 사항은 즉각적입니다.

.zReader-requested { 
    height: 50px; 
} 
.zreader-received { 
    height: auto; 
} 

여기서 내가 뭘 잘못하고 있니?

Answer 1

전환을 아직 구현하지 않았습니다. 당신이 한 일은 요소의 클래스를 바꾸는 것이었고, 그 결과는 즉시 발생했습니다.

당신이해야 할 일은 수업을 전환하는 것이 아니라 무엇인가 일어날 때 애니메이션을 시작하는 것입니다.