1
我有一個按鈕作爲下拉菜單和動畫顯示和隱藏下拉菜單。 如何檢查動畫完成並添加樣式顯示:無到下拉菜單引導下拉菜單顯示:無完成後動畫
HTML
<div class="dropdown">
<button class="btn btn-default dropdown-toggle " type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
Dropdown
<span class="caret"></span>
</button>
<ul class="dropdown-menu dropdown-info" aria-labelledby="dropdownMenu1">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li role="separator" class="divider"></li>
<li><a href="#">Separated link</a></li>
</ul>
</div>
CSS
.open > .dropdown-menu.dropdown-info {
opacity: 1;
left: 0px;
}
.dropdown-menu.dropdown-info {
display: block;
position: absolute;
top:70px;
left: 30px;
opacity: 0;
transition: all 0.2s ease-out;
-webkit-transition: all 0.2s ease-out;
}
沒有。如果你添加顯示:沒有你刪除動畫 –
@ArturBajak問題沒有清楚地解釋,通過刪除動畫,你是什麼意思,在你的問題中,你已經提出了一些關於添加'display:none'的原因是什麼? –
當我點擊按鈕後,然後顯示下拉菜單動畫,當我再次點擊,然後顯示隱藏動畫下拉菜單,當動畫結束然後drodown菜單顯示爲無 –