懸停時css類過渡不起作用

-1

下面是使用css過渡滑動到50％div內的div的代碼。我遇到了一個問題，雖然我的課程和ID。 CSS是正確的，但我無法得到它的工作，有人可以告訴我我哪裏出了錯？懸停時css類過渡不起作用

在此先感謝。

CSS

<style> 
    .maincontentdiv { 
     position:relative; 
     height:200px; 
     width:200px; 
     background:red; 
    } 
    .slideup { 
     position:absolute; 
     bottom:0; 
     max-height:0; 
     overflow:hidden; 
     background:blue; 
     transition:max-height 250ms ease-in; 
    } 
    .maincontentdiv:hover { 
     max-height:50%; 
    } 
</style>

HTML

<div class="maincontentdiv"> 
    <div class="slideup"></div> 
</div>

，當我用它工作正常股利和股利股利的替代類和ID，但是當我嘗試使用類和id它停止工作，所以我不認爲這將是實際的代碼:)

來源

2014-05-12 user3611948

@RachelGallen它，當我用的股利和股利DIV替代類和id工作正常，但是當我嘗試使用類和id它停止工作，所以我不認爲這將是實際的代碼:) – user3611948

http://jsbin.com/slideUpUsingMinHeight/

.maincontentdiv { 
    position:relative; 
    height:200px; 
    width:200px; 
    background:red; 
} 
.slideup { 
    position:absolute; 
    width:100%;   /* Absolute el. loose width so... */ 
    bottom:0; 
    min-height:0;  /* Use min- height instead */ 
    background:blue; 
    transition: min-height 250ms ease-in; /* target min-height respectively */ 
} 
.maincontentdiv:hover > .slideup { /* hover el > children selector */ 
    min-height: 50%; /* and animate! */ 
}

來源

2014-05-12 11:07:40