使股利矩形擴展（高度）後點擊鏈接

Question

我有一個div

<div class="dropdwn"></div> 

，我想它是在屏幕的整個寬度，以及矩形的下擴大25個像素（向下）與流體動畫。

.successDropdwn { 
     width: 100%; 
     max-height: 0; 
     overflow: hidden; 
     color: green; 
     -webkit-transition: max-height 0.8s; 
     -moz-transition: max-height 0.8s; 
     transition: max-height 0.8s; 
    } 

Answer 1

這樣的事情???

$('.dropdwn').slideDown('slow')

.dropdwn{ 
 
    background-color:#dddddd; 
 
    height:25px; 
 
    }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="dropdwn" style="display:none"></div>

Answer 2

我不知道你想做什麼，但是這是使用通過切換一類的jQuery過渡的例子：

https://jsfiddle.net/gydg7j9m/5/

.dropdwn { 
    background: firebrick; 
    width: 100%; 
    height: 50px; 
    max-height: 0; 
    overflow: hidden; 
    color: green; 
    transition: max-height 0.8s; 
} 

.expand { 
    max-height: 150px; 
} 

jQuery的

$('#btn').on('click', function(){ 
$('.dropdwn').toggleClass('expand') 
});